/* ============================================================
   Asucena's Tax Services LLC — stylesheet
   Tailwind-compatible utility classes, hand-built and minified
   to only what this site uses (~7 KB, no JavaScript).

   The HTML uses standard Tailwind class names, so if you ever
   want the full framework you can run a normal Tailwind build
   and swap this file out with no markup changes.

   Brand palette (sampled from the live site):
     brand-blue   #2F4393  royal blue — hero, footer, headings
     brand-navy   #23316C  deep navy — text on lime buttons
     brand-green  #98C455  lime — primary buttons
     brand-sky    #EEF1FA  pale blue panels
     brand-mint   #F1F8E6  pale lime pills
   ============================================================ */

:root{
  --brand-navy:#23316C;        /* deep navy — headings, text on lime */
  --brand-blue:#2F4393;        /* royal blue — hero, logo, links */
  --brand-sky:#EEF1FA;         /* pale blue panels */
  --brand-green:#98C455;       /* lime — primary buttons */
  --brand-green-dark:#87B345;  /* lime hover */
  --brand-green-ink:#526F27;   /* readable green for small text */
  --brand-mint:#F1F8E6;        /* pale lime pills */
  --ink:#1C2430;
  --muted:#5A6577;
  --line:#E1E5EE;
  --page:#F6F7FB;
}

*,::before,::after{box-sizing:border-box;border:0 solid var(--line);margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;
  font-family:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
body{line-height:1.6;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;
  font-feature-settings:"ss01","cv05"}
h1,h2,h3,h4{font-size:inherit;font-weight:inherit;line-height:1.15;letter-spacing:-.022em}
a{color:inherit;text-decoration:inherit}
img{display:block;max-width:100%;height:auto}
svg{display:block;flex:none}
button,input,select,textarea{font:inherit;color:inherit;background:transparent}
ul,ol{list-style:none}
:focus-visible{outline:3px solid var(--brand-blue);outline-offset:2px;border-radius:4px}

/* layout */
.container{width:100%;margin-inline:auto;padding-inline:1rem;max-width:1120px}
.relative{position:relative}.absolute{position:absolute}.sticky{position:sticky}
.top-0{top:0}.inset-0{inset:0}
.z-50{z-index:50}.z-10{z-index:10}
.block{display:block}.inline-block{display:inline-block}.inline-flex{display:inline-flex}
.flex{display:flex}.grid{display:grid}.hidden{display:none}
.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1 1 0%}
.items-center{align-items:center}.items-start{align-items:flex-start}
.justify-center{justify-content:center}.justify-between{justify-content:space-between}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.w-full{width:100%}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-14{width:3.5rem}
.h-5{height:1.25rem}.h-6{height:1.5rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-14{height:3.5rem}
.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-prose{max-width:65ch}
.mx-auto{margin-inline:auto}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-7{margin-top:1.75rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.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}
.my-4{margin-block:1rem}
.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}
.px-3{padding-inline:.75rem}.px-4{padding-inline:1rem}.px-5{padding-inline:1.25rem}.px-6{padding-inline:1.5rem}
.py-1{padding-block:.25rem}.py-2{padding-block:.5rem}.py-3{padding-block:.75rem}.py-4{padding-block:1rem}
.py-10{padding-block:2.5rem}.py-12{padding-block:3rem}.py-16{padding-block:4rem}
.pt-2{padding-top:.5rem}.pt-6{padding-top:1.5rem}.pb-6{padding-bottom:1.5rem}.pb-12{padding-bottom:3rem}
.space-y-3>*+*{margin-top:.75rem}.space-y-4>*+*{margin-top:1rem}.space-y-6>*+*{margin-top:1.5rem}

/* type */
.text-xs{font-size:.78rem;line-height:1.5}
.text-sm{font-size:.9rem;line-height:1.6}
.text-base{font-size:1rem}
.text-lg{font-size:1.1rem;line-height:1.65}
.text-xl{font-size:1.25rem;line-height:1.45}
.text-2xl{font-size:1.5rem;line-height:1.3}
.text-3xl{font-size:2rem;line-height:1.16}
.text-4xl{font-size:2.45rem;line-height:1.1}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}
.tracking-tight{letter-spacing:-.02em}.tracking-wide{letter-spacing:.06em}
.uppercase{text-transform:uppercase}
.text-center{text-align:center}
.leading-relaxed{line-height:1.75}
.italic{font-style:italic}
.underline{text-decoration:underline;text-underline-offset:3px}

/* color */
.text-white{color:#fff}
.text-ink{color:var(--ink)}
.text-muted{color:var(--muted)}
.text-navy{color:var(--brand-navy)}
.text-blue{color:var(--brand-blue)}
.text-green{color:var(--brand-green-ink)}
.text-lime{color:var(--brand-green)}
.pill-lime{display:inline-block;background:var(--brand-mint);color:var(--brand-green-ink);
  font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  padding:.4rem 1rem;border-radius:9999px}
.bg-white{background-color:#fff}
.bg-navy{background-color:var(--brand-blue)}
.bg-blue{background-color:var(--brand-blue)}
.bg-sky{background-color:var(--brand-sky)}
.bg-green{background-color:var(--brand-green)}
.bg-mint{background-color:var(--brand-mint)}
.bg-slate{background-color:var(--page)}
/* Hero background. The two glows are sized in PERCENT, not pixels, so the
   gradient renders in the same proportions whether the hero is short (Blog,
   Contact) or tall (Home). With pixel sizes the blue drifted noticeably at the
   lower edge from page to page. */
.bg-hero{background:
  radial-gradient(70% 85% at 94% -18%, rgba(152,196,85,.20), transparent 60%),
  radial-gradient(64% 85% at 2% 112%, rgba(126,166,255,.26), transparent 62%),
  linear-gradient(165deg,#2A3C86 0%, var(--brand-blue) 58%, #3A52B0 100%)}
.bg-hero-soft{background:linear-gradient(170deg,var(--brand-sky) 0%,#F7F9FD 100%)}

/* borders, shape, shadow */
.rounded{border-radius:.375rem}.rounded-lg{border-radius:.6rem}.rounded-xl{border-radius:.9rem}.rounded-2xl{border-radius:1.15rem}.rounded-full{border-radius:9999px}
.border{border-width:1px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}.border-l-4{border-left-width:4px}
.border-line{border-color:var(--line)}
.border-white-20{border-color:rgba(255,255,255,.28)}
.border-green{border-color:var(--brand-green)}
.shadow-sm{box-shadow:0 1px 2px rgba(15,61,110,.06)}
.shadow{box-shadow:0 2px 10px rgba(15,61,110,.07)}
.shadow-md{box-shadow:0 8px 24px rgba(15,61,110,.10)}
.overflow-hidden{overflow:hidden}

/* components */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.82rem 1.6rem;border-radius:9999px;font-weight:600;font-size:.98rem;
  transition:background-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease;
  cursor:pointer;text-align:center}
.btn:active{transform:translateY(1px)}
.btn-green{background:var(--brand-green);color:var(--brand-navy);box-shadow:0 2px 10px rgba(47,67,147,.18)}
.btn-green:hover{background:var(--brand-green-dark)}
.btn-blue{background:var(--brand-blue);color:#fff}
.btn-blue:hover{background:var(--brand-navy)}
.btn-outline{border:1.5px solid var(--brand-blue);color:var(--brand-blue);background:#fff}
.btn-outline:hover{background:var(--brand-sky)}
.btn-ghost-light{border:1.5px solid rgba(255,255,255,.55);color:#fff}
.btn-ghost-light:hover{background:rgba(255,255,255,.12)}
.btn-sm{padding:.5rem 1rem;font-size:.87rem}
/* phones: smaller buttons — full-width pills look oversized at 390px */
@media (max-width:639px){
  .btn{padding:.66rem 1.2rem;font-size:.92rem}
  .btn-sm{padding:.42rem .85rem;font-size:.83rem}
  .chip{padding:.4rem .8rem;font-size:.88rem}
}

.card{position:relative;background:#fff;border:1px solid var(--line);border-radius:1.1rem;padding:1.75rem;
  transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}
.card:hover{box-shadow:0 16px 40px rgba(47,67,147,.11);transform:translateY(-3px);border-color:#CFD7EA}

/* step card with a big ghost numeral and a lime rail */
.step-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);
  border-radius:1.1rem;padding:1.75rem;transition:box-shadow .2s ease,transform .2s ease}
.step-card:hover{box-shadow:0 16px 40px rgba(47,67,147,.11);transform:translateY(-3px)}
.step-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--brand-green)}
.ghost-num{position:absolute;right:1rem;top:.1rem;font-size:5.5rem;font-weight:800;
  line-height:1;color:var(--brand-blue);opacity:.07;pointer-events:none;letter-spacing:-.04em}

/* hero trust chips */
.chip{display:inline-flex;align-items:center;gap:.55rem;padding:.5rem .95rem;border-radius:9999px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  font-size:.95rem;font-weight:500;color:#fff}

/* big tappable link card */
.linkcard{display:block;position:relative;background:#fff;border:1px solid var(--line);
  border-radius:1.1rem;padding:1.75rem 3.25rem 1.75rem 1.75rem;
  transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}
.linkcard:hover{box-shadow:0 16px 40px rgba(47,67,147,.11);transform:translateY(-3px);border-color:var(--brand-green)}
.linkcard::after{content:"→";position:absolute;right:1.5rem;top:50%;transform:translateY(-50%);
  font-size:1.5rem;color:var(--brand-blue);opacity:.45;transition:transform .2s ease,opacity .2s ease}
.linkcard:hover::after{transform:translateY(-50%) translateX(4px);opacity:1}

.rule{height:4px;width:3.5rem;border-radius:9999px;background:var(--brand-green)}

/* disclosure — content stays hidden until the button is clicked (no JavaScript) */
.disclose summary{display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;list-style:none;
  padding:.72rem 1.4rem;border-radius:9999px;border:1.5px solid var(--brand-blue);
  color:var(--brand-blue);background:#fff;font-weight:600;font-size:.95rem;
  transition:background-color .15s ease}
.disclose summary::-webkit-details-marker{display:none}
.disclose summary::after{content:"＋";font-weight:700;font-size:.95rem;line-height:1}
.disclose[open] summary::after{content:"−"}
.disclose summary:hover{background:var(--brand-sky)}
.disclose-body{margin-top:1.25rem;padding:1.25rem;border-radius:.9rem;background:var(--brand-sky)}

/* testimonials */
.quote{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:1.1rem;padding:1.75rem}
.quote p{font-size:1.06rem;line-height:1.5;font-weight:700;color:var(--brand-blue);
  letter-spacing:-.015em;margin-bottom:1.5rem;flex:1 1 auto}
.quote cite{display:block;font-style:normal;color:var(--muted);font-size:.92rem;
  border-top:1px solid var(--line);padding-top:1rem}
.quote .who{display:block;color:var(--muted);font-size:.92rem}

.navlink{padding:.45rem .2rem;font-size:.95rem;font-weight:500;color:#2B3A4A;
  border-bottom:2px solid transparent;transition:color .15s ease,border-color .15s ease}
.navlink:hover{color:var(--brand-blue)}
.navlink[aria-current="page"]{color:var(--brand-navy);border-bottom-color:var(--brand-green)}

.field{width:100%;padding:.68rem .85rem;border:1px solid var(--line);border-radius:.55rem;
  background:#fff;transition:border-color .15s ease,box-shadow .15s ease}
.field:focus{outline:none;border-color:var(--brand-blue);box-shadow:0 0 0 3px rgba(29,93,166,.15)}
.label{display:block;font-size:.85rem;font-weight:600;color:#2B3A4A;margin-bottom:.3rem}

.prose p{margin-bottom:1rem}
.prose p:last-child{margin-bottom:0}

/* mobile nav via checkbox — no JavaScript */
#navtoggle{position:absolute;opacity:0;pointer-events:none}
#navtoggle:checked~#mobilemenu{display:block}

.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:100;background:#fff;padding:.6rem 1rem;border-radius:.4rem;box-shadow:0 4px 16px rgba(0,0,0,.2)}

/* ---------- responsive ---------- */
/* utility overrides — these must win over component defaults */
.card.bg-sky{background-color:var(--brand-sky)}
.card.bg-mint{background-color:var(--brand-mint)}
.card.bg-navy{background-color:var(--brand-navy)}
.card.border-l-4{border-left-width:4px}
.card.border-green{border-left-color:var(--brand-green)}

.flex-none{flex:none}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media (min-width:640px){
  .container{padding-inline:1.5rem}
  .sm\:flex{display:flex}
  .sm\:block{display:block}
  .sm\:inline{display:inline}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:text-4xl{font-size:2.55rem;line-height:1.12}
  .sm\:text-left{text-align:left}
  .sm\:flex-row{flex-direction:row}
  .sm\:w-auto{width:auto}
}
@media (min-width:768px){
  .md\:flex{display:flex}
  .md\:hidden{display:none}
  .md\:block{display:block}
  .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\:py-16{padding-block:4rem}
  .md\:py-20{padding-block:5rem}
  .md\:py-24{padding-block:6rem}
  .md\:text-5xl{font-size:3.4rem;line-height:1.04}
  .md\:text-4xl{font-size:2.45rem;line-height:1.1}
  .md\:text-3xl{font-size:2rem;line-height:1.16}
  .md\:text-2xl{font-size:1.55rem}
  .md\:text-xl{font-size:1.25rem;line-height:1.45}
  .md\:text-lg{font-size:1.15rem}
}
@media (min-width:1024px){
  .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\:text-5xl{font-size:3.25rem;line-height:1.07}
}
@media print{header,footer,.btn{display:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}
