@font-face {
  font-family: 'Inter Tight';
  src: url('../../assets/inter-tight.ttf') format('truetype');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: Caveat;
  src: url('../../assets/caveat.ttf') format('truetype');
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

.shivam-seo {
  --seo-paper: #f3f3ec;
  --seo-sage: #e6eadc;
  --seo-navy: #142554;
  --seo-ink: #20231f;
  --seo-muted: #505e49;
  --brand: #183cd1;
  --brand-dark: #132d9a;
  --surface: #eceee5;
  --ink: var(--seo-ink);
  --heading: var(--seo-ink);
  --heading-color: var(--seo-ink);
  --line: #c3caba;
  --container-site: 1488px;
  --spacing-gutter: clamp(20px, 4vw, 56px);
  --text-display: clamp(2.45rem, 5.1vw, 5.3rem);
  background: var(--seo-paper);
  color: var(--seo-ink);
  font-family: 'Inter Tight', system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.55;
}
html { scroll-behavior: smooth; }
.shivam-seo :focus-visible { outline: 2px solid #ed8154; outline-offset: 4px; }
.seo-skip { position: absolute; z-index: 5; left: 20px; top: 12px; padding: 10px 16px; background: white; transform: translateY(-150%); }
.seo-skip:focus { transform: none; }

.seo-header, .seo-footer { padding-inline: var(--spacing-gutter); }
.seo-header-inner, .seo-footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  min-height: 88px;
}
.seo-header-inner { border-bottom: 1px solid var(--line); }
.seo-brand, .seo-header nav { display: flex; align-items: center; gap: clamp(9px, 2.1vw, 32px); }
.seo-brand { gap: 9px; font-size: 1.3rem; font-weight: 650; letter-spacing: -.045em; white-space: nowrap; }
.seo-brand img { width: clamp(38px, 4vw, 52px); height: auto; }
.seo-header nav, .seo-footer { font-size: .9375rem; font-weight: 550; }
.seo-header nav a, .seo-footer-inner > a:last-child { padding-block: 12px; }
.seo-header-contact { border-bottom: 1px solid currentColor; }
.seo-header-contact span { color: var(--brand); }
.seo-footer { background: #152322; color: #fffef8; }

.seo-section, .seo-hero { padding: clamp(52px, 8vw, 116px) var(--spacing-gutter); }
.seo-hero { padding-block: clamp(42px, 4.4vw, 74px); }
.seo-section h2 {
  font-size: clamp(2.3rem, 5.15vw, 5.2rem);
  font-weight: 600;
  letter-spacing: -.046em;
  line-height: 1;
  text-wrap: balance;
}
.seo-hero-grid, .seo-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 7vw, 105px); }
.seo-hero-grid { align-items: center; }
.seo-kicker { margin-bottom: 14px; font-size: .8125rem; color: var(--brand); font-weight: 650; }
.seo-hero h1 {
  font-size: clamp(3rem, 6.5vw, 7rem);
  font-weight: 620;
  letter-spacing: -.055em;
  line-height: .96;
}
.seo-hero h1 em { color: var(--brand); font-style: normal; }
.seo-lead { margin-top: 20px; max-width: 49ch; font-size: clamp(1.0625rem, 1.55vw, 1.35rem); line-height: 1.55; text-wrap: pretty; }
.seo-hero .seo-lead, .seo-process .seo-lead, .seo-compare .seo-lead, .seo-letter .seo-lead { color: var(--seo-muted); }
.seo-actions { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-top: 26px; align-items: center; }
.seo-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 12px 18px;
  min-height: 48px;
  border-radius: 4px;
  color: white;
  background: var(--brand);
  font-size: .9375rem;
  font-weight: 620;
  transition: background .2s, transform .2s;
}
.seo-button:hover { background: var(--brand-dark); transform: translateY(-2px); }
.seo-text-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; text-decoration: underline; text-underline-offset: .3em; font-weight: 600; }
.seo-split .seo-text-link { margin-top: 14px; }
.seo-header a:hover, .seo-footer a:hover, .seo-credit a { text-decoration: underline; text-underline-offset: .25em; }

.seo-hero .seo-hero-figure {
  display: block;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fffef8;
  box-shadow: 0 18px 42px #29372314;
}
.seo-hero figure img { width: 100%; height: auto; }
.seo-hero figure figcaption { background: var(--seo-sage); }
.seo-hero figure figcaption > span:first-child {
  color: var(--brand);
  font-size: clamp(2.2rem, 4.8vw, 5rem);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
}
.seo-credit { display: block; margin-top: 14px; color: var(--seo-muted); font-size: .8125rem; }
.seo-results .seo-credit { margin-top: 20px; }
.seo-results .seo-credit a { color: var(--brand); }

.seo-process, .seo-faq { background: var(--seo-sage); }
.seo-process-intro { align-self: start; position: sticky; top: 10vh; }
.seo-steps { list-style: none; margin: 0; padding: 0; }
.seo-steps li {
  display: grid;
  grid-template-columns: clamp(47px, 6vw, 87px) minmax(0, 1fr);
  gap: 16px;
  border-top: 1px solid #b6c0ad;
  padding: clamp(20px, 3vw, 38px) 0;
}
.seo-step-index {
  font-size: clamp(1.7rem, 3.7vw, 3.8rem);
  line-height: 1;
  letter-spacing: -.035em;
  font-weight: 550;
  color: var(--brand);
}
.seo-steps h3, .seo-pricing-list h3, .seo-offer-details h3 {
  font-size: clamp(1.35rem, 2.4vw, 2.2rem);
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1.1;
}
.seo-steps li p, .seo-pricing-list li p { margin-top: 9px; max-width: 55ch; }
.seo-step-output { display: block; margin-top: 15px; font-size: .875rem; color: var(--brand); font-weight: 620; }
.seo-dark, .seo-related a { display: grid; gap: 4px; padding: 15px 0; border-top: 1px solid var(--line); }
.seo-related strong { font-size: 1.2rem; color: var(--brand); }
.seo-related a:hover strong { text-decoration: underline; }

.seo-image-dialog {
  width: max-content;
  max-width: 90vw;
  max-height: 90dvh;
  margin: auto;
  padding: 2.75rem 0 0;
  border: 0;
  background: transparent;
}
.seo-image-dialog::backdrop { background: rgb(0 0 0 / .8); }
.seo-image-dialog img { display: block; max-width: 100%; max-height: calc(90dvh - 2.75rem); }
.seo-image-dialog button { position: absolute; top: 0; right: 0; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: white; color: black; font-size: 1.5rem; }

@media (min-width: 1px) {
  .seo-hero h1, .seo-hero-figure, .seo-accordion details[open] p, .seo-steps li.is-visible, .seo-paper.is-visible {
    animation: seo-enter .55s cubic-bezier(.22, 1, .36, 1) both;
  }
  .seo-hero-figure { animation-delay: .12s; }
  @keyframes seo-enter { from { transform: translateY(11px); opacity: .45; } }
}
@media (max-width: 760px) {
  .seo-hero-grid, .seo-split, .seo-letter .seo-split { grid-template-columns: minmax(0, 1fr); }
  .seo-process-intro { position: static; }
}
@media (max-width: 540px) {
  .seo-header-inner { flex-wrap: wrap; gap: 0 18px; padding-block: 10px; }
  .seo-header nav { flex-wrap: wrap; column-gap: 16px; }
  .seo-header nav a { padding-block: 9px; }
  .seo-compare td { font-size: .9375rem; }
}
@media (max-width: 0px) {
  html { scroll-behavior: auto; }
  .seo-button { transition: none; }
  .seo-button:hover { transform: none; }
}

/* The hero grid has its own placement so chart utilities cannot create implicit columns. */
.seo-hero-grid > * { min-width: 0; }
.seo-hero-grid > .seo-hero-figure { grid-area: 1 / 2; overflow: hidden; width: min(100%, 575px); justify-self: end; }
.seo-hero h1 { font-size: clamp(2.45rem, 4.75vw, 5.4rem); text-wrap: balance; }
.seo-hero h1 em { display: block; }
.seo-hero-grid { column-gap: clamp(28px, 5vw, 82px); row-gap: 28px; }
.seo-hero .seo-hero-figure img { display: block; }
.seo-hero .seo-hero-figure figcaption { padding: 16px 22px; }

.seo-reviews {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(150px, .65fr) minmax(0, 2fr);
  gap: 18px 26px;
  align-items: center;
  padding-top: 23px;
  border-top: 1px solid var(--line);
}
.seo-review-rating { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; line-height: 1.25; }
.seo-review-rating small { display: block; color: var(--seo-muted); margin-top: 3px; }
.seo-stars, .seo-reviews li span { color: var(--brand); letter-spacing: .13em; }
.seo-reviews ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.seo-reviews li {
  min-width: 0;
  padding: 12px 15px;
  background: #fffef8;
  border: 1px solid var(--line);
  border-radius: 4px;
}
.seo-reviews blockquote { margin: 4px 0 0; font-size: clamp(.875rem, 1.25vw, 1.05rem); font-weight: 550; }

.seo-step-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}
.seo-step-nav a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 6px 11px;
  border: 1px solid #aab79f;
  border-radius: 4px;
  font-size: .875rem;
  font-weight: 600;
  transition: background .25s, color .25s;
}
.seo-step-nav a span { color: var(--brand); font-variant-numeric: tabular-nums; }
.seo-step-nav a:hover, .seo-step-nav a[aria-current="step"] { background: var(--brand); color: #fff; border-color: var(--brand); }
.seo-step-nav a:hover span, .seo-step-nav a[aria-current="step"] span { color: #fff; }
.seo-steps li { min-height: clamp(180px, 36vh, 315px); align-content: center; scroll-margin-top: 20vh; }
.seo-steps li:last-child { border-bottom: 1px solid #b6c0ad; }
.seo-steps .seo-step-index { transition: transform .35s cubic-bezier(.22, 1, .36, 1); }
.seo-steps li.is-current .seo-step-index { transform: translateX(5px); }
.seo-steps li.is-current h3 { color: var(--brand-dark); }

.seo-compare table {
  overflow: hidden;
  border: 1px solid var(--line);
  border-collapse: separate;
  border-spacing: 0;
  background: #fffef8;
  border-radius: 5px;
}
.seo-compare thead th { background: #e4eadc; }
.seo-compare thead th:first-child { width: 22%; }
.seo-compare tbody th { font-size: clamp(.875rem, 1.6vw, 1.14rem); font-weight: 620; }
.seo-compare :is(th, td) + :is(th, td) { border-left: 1px solid var(--line); }
.seo-compare thead th:last-child { background: var(--brand); color: #fff; }
.seo-compare tbody tr:last-child > * { border-bottom: 0; }

.seo-results h2 { margin-bottom: 30px; }
.seo-more { margin-top: 24px; }
.seo-more summary {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  color: var(--brand-dark);
  text-decoration: underline;
  text-underline-offset: .25em;
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.seo-more summary::-webkit-details-marker { display: none; }
.seo-more summary::after { content: '+'; font-size: 1.4em; font-weight: 400; }
.seo-more[open] summary::after { content: '−'; }
.seo-more:not([open]) .seo-more-close, .seo-more[open] .seo-more-open { display: none; }
.seo-results .seo-gallery {
  margin-top: 16px;
  columns: 3;
  column-gap: 16px;
}
.seo-gallery li { break-inside: avoid; margin-bottom: 16px; border: 1px solid var(--line); background: #fffef8; }
.seo-gallery img { display: block; width: 100%; height: auto; }
.seo-gallery a { padding: 6px; }

.seo-letter .seo-split { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.seo-letter-copy {
  color: var(--seo-ink);
  font-size: clamp(1.1rem, 1.65vw, 1.5rem);
  font-weight: 470;
  line-height: 1.56;
  letter-spacing: -.013em;
}
.seo-letter-copy p + p { margin-top: 1.1em; }
.seo-letter-copy > p:first-child {
  color: var(--seo-ink);
  font-size: clamp(1.7rem, 3vw, 2.7rem);
  line-height: 1.08;
  letter-spacing: -.04em;
  font-weight: 620;
}
.seo-letter-more summary { margin-bottom: 12px; font-size: .9375rem; }

.seo-offer { background: var(--seo-paper); }
.seo-offer-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  overflow: hidden;
  border: 1px solid #b3c1f4;
  border-radius: 5px;
  background: #e4eaff;
}
.seo-offer-copy { padding: clamp(26px, 5vw, 76px); }
.seo-offer-copy h2 { max-width: 14ch; color: #142554; }
.seo-offer-copy .seo-button { margin-top: 24px; }
.seo-offer-note { margin-top: 10px; color: var(--seo-muted); font-size: .875rem; }
.seo-offer-details {
  padding: clamp(24px, 4vw, 62px);
  color: #fffef8;
  background: var(--seo-navy);
  align-content: center;
}
.seo-offer-details h3 { color: #fffef8; }
.seo-offer-details ul { margin: 18px 0 0; padding: 0; }
.seo-offer-details li {
  display: grid;
  grid-template-columns: 19px 1fr;
  gap: 8px;
  padding: 12px 0;
  border-top: 1px solid #697ba4;
}
.seo-offer-details li::before { content: '✓'; color: #bfceff; }
@media (min-width: 1px) {
  .seo-compare table.is-visible, .seo-offer-card.is-visible { animation: seo-enter .55s cubic-bezier(.22, 1, .36, 1) both; }
  .seo-reviews li { animation: seo-enter .52s cubic-bezier(.22, 1, .36, 1) both; }
  .seo-reviews li:nth-child(2) { animation-delay: .09s; }
  .seo-reviews li:nth-child(3) { animation-delay: .18s; }
  .seo-more[open] > :is(ul, p) { animation: seo-enter .35s cubic-bezier(.22, 1, .36, 1) both; }
}
@media (max-width: 850px) {
  .seo-reviews { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .seo-hero-grid > .seo-hero-figure { grid-area: auto; justify-self: start; }
  .seo-offer-card, .seo-letter .seo-split { grid-template-columns: minmax(0, 1fr); }
  .seo-steps li { min-height: 0; scroll-margin-top: 16px; }
  .seo-results .seo-gallery { columns: 2; }
}
@media (max-width: 540px) {
  .seo-reviews ul { grid-template-columns: 1fr; }
  .seo-compare :is(th, td) { overflow-wrap: anywhere; padding: 9px 7px; font-size: .8125rem; }
  .seo-compare thead th:first-child { width: 24%; }
  .seo-compare thead th { font-size: .9rem; }
  .seo-results .seo-gallery { columns: 1; }
}
@media (max-width: 0px) {
  .seo-step-nav a, .seo-steps .seo-step-index { transition: none; }
  .seo-steps li.is-current .seo-step-index { transform: none; }
}

/* Hero isolation: the imported reference stylesheet contains utility rules for
   the charts. Keep this composition independent of those generated classes. */
#hero-section .seo-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr) !important;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: clamp(32px, 6vw, 92px);
  row-gap: 30px;
}
#hero-section .seo-hero-grid > :first-child {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
}
#hero-section .seo-hero-grid > .seo-hero-figure {
  grid-column: 2 !important;
  grid-row: 1 !important;
  grid-area: auto / 2 / auto / auto;
  width: 100%;
  max-width: 575px;
  min-width: 0;
  justify-self: end;
  align-self: center;
}
#hero-section .seo-reviews {
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
}
#hero-section .seo-hero h1,
#hero-section h1 {
  max-inline-size: 12ch;
  font-size: clamp(3.1rem, 5.1vw, 5.65rem);
  overflow-wrap: normal;
  hyphens: none;
}
#hero-section .seo-actions { min-width: 0; }

@media (max-width: 760px) {
  #hero-section .seo-hero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto;
    gap: 26px;
  }
  #hero-section .seo-hero-grid > :first-child,
  #hero-section .seo-hero-grid > .seo-hero-figure,
  #hero-section .seo-reviews {
    grid-column: 1 !important;
    grid-row: auto !important;
    grid-area: auto !important;
    justify-self: stretch;
    width: 100%;
    max-width: none;
  }
  #hero-section .seo-hero h1,
  #hero-section h1 { max-inline-size: 10.5ch; }
}
