/* Shared inner-page patterns */
.content-section {
  padding: 72px 0;
}

.content-section.alt {
  background: var(--color-bg);
}

.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.two-col-form {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 56px;
  align-items: start;
}

.feature-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
}

.feature-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.feature-item .icon-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  /* background: var(--color-teal-soft); */
  color: var(--color-teal);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 700;
}

.feature-item h4 {
  font-size: var(--fs-md);
  margin-bottom: 4px;
}

.feature-item p {
  font-size: var(--fs-sm);
  color: var(--color-text-secondary);
}

.bullets {
  margin-top: 20px;
}

.bullets li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 12px;
  font-size: var(--fs-base);
  color: var(--color-text-secondary);
}

.bullets li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-teal);
}

.steps-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.media-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  background: #fff;
}

.media-card img {
  width: 100%;
  height: 280px;
  object-fit: cover;
}

.media-card .body {
  padding: 22px;
}

.resource-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.resource-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 28px;
}

.resource-card h3 {
  font-size: var(--fs-lg);
  margin-bottom: 10px;
}

.resource-card p {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.65;
  margin-bottom: 18px;
  flex: 1;
}

.resource-card .text-link {
  margin-top: auto;
}

.section-resources {
  padding-top: 24px;
  background: var(--color-white);
}

.page-hero--resources h1 {
  max-width: 15em;
}

.page-hero--resources p {
  max-width: 480px;
}

.article-hero h1 {
  max-width: 14em;
}

.article-hero p {
  margin-bottom: 28px;
}

.article-body {
  padding-top: 64px;
  padding-bottom: 96px;
}

.article-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 64px;
  align-items: start;
}

.article-points {
  display: flex;
  flex-direction: column;
}

.article-point {
  padding: 28px 0;
  border-bottom: 1px solid var(--color-border-light);
}

.article-point:first-child {
  padding-top: 0;
}

.article-point:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.article-point h2 {
  font-size: var(--fs-2xl);
  color: var(--color-navy);
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}

.article-point p {
  font-size: var(--fs-base);
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin: 0;
  max-width: 540px;
}

.article-consult {
  background: var(--color-bg);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  position: sticky;
  top: calc(var(--header-h) + 24px);
}

.article-consult h3 {
  font-size: var(--fs-lg);
  color: var(--color-navy);
  margin-bottom: 16px;
}

.article-consult .bullets {
  margin-top: 0;
  margin-bottom: 24px;
}

.article-consult .bullets li {
  margin-bottom: 10px;
}

.article-consult .btn {
  margin-top: 4px;
}

.legal-wrap {
  max-width: 800px;
  margin: 0 auto;
  padding: 48px 0 80px;
}

.legal-wrap h1 {
  font-size: var(--fs-3xl);
  margin-bottom: 12px;
}

.legal-wrap .updated {
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
  margin-bottom: 32px;
}

.legal-wrap h2 {
  font-size: var(--fs-lg);
  margin: 32px 0 12px;
}

.legal-wrap p,
.legal-wrap li {
  font-size: var(--fs-base);
  color: var(--color-text-secondary);
  margin-bottom: 12px;
  line-height: 1.75;
}

.legal-wrap ul {
  padding-left: 20px;
  margin-bottom: 16px;
}

.legal-wrap ul li {
  list-style: disc;
}

/* Legal pages (privacy / terms) — mockup layout */
.content-section.legal-body {
  background: var(--color-white);
  padding-top: 64px;
  padding-bottom: 96px;
}

.legal-content {
  max-width: 1360px;
  margin: 0 auto;
}

.legal-points {
  display: flex;
  flex-direction: column;
}

.legal-point {
  padding: 28px 0;
  border-bottom: 1px solid var(--color-border-light);
}

.legal-point:first-child {
  padding-top: 0;
}

.legal-point h2 {
  font-size: var(--fs-2xl);
  color: var(--color-navy);
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}

.legal-point p {
  font-size: var(--fs-base);
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin: 0;
}

.legal-designer-note {
  margin-top: 40px;
}

.legal-designer-note p {
  color: #9a7a4d;
}

.faq-hero h1 {
  max-width: none;
}

.faq-hero p {
  margin-bottom: 28px;
}

.page-hero.about-hero h1 {
  max-width: 16em;
}

.about-hero p {
  max-width: 580px;
  margin-bottom: 28px;
}

.about-values {
  padding-top: 40px;
  padding-bottom: 88px;
}

.about-value-card {
  background: var(--color-bg);
  box-shadow: none;
  border: 1px solid var(--color-border-light);
  padding: 28px 26px 32px;
}

.about-value-card .num-badge {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: 0.04em;
  margin-bottom: 16px;
}

.about-value-card h3 {
  font-size: var(--fs-xl);
  color: var(--color-navy);
  margin-bottom: 10px;
}

.about-value-card p {
  font-size: var(--fs-base);
  color: var(--color-text-secondary);
  line-height: 1.65;
  margin: 0;
}

.faq-section {
  padding-top: 48px;
  padding-bottom: 96px;
}

.faq-wrap {
  max-width: 920px;
  margin: 0;
  padding: 0;
}

.faq-wrap .accordion-trigger {
  padding: 26px 0;
  font-size: var(--fs-lg);
}

.faq-wrap .accordion-item.is-open .accordion-trigger {
  padding-bottom: 10px;
}

.faq-wrap .accordion-panel {
  max-width: 720px;
  padding: 0 40px 26px 0;
  font-size: var(--fs-base);
  color: var(--color-text-secondary);
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 40px;
  align-items: start;
}

.contact-copy .contact-info-card {
  margin-top: 28px;
}

.contact-info-card {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-float);
  padding: 28px 24px;
  max-width: 420px;
}

.contact-info-logo {
  height: 48px;
  width: auto;
  display: block;
  margin-bottom: 16px;
}

.contact-info-name {
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-navy);
  margin-bottom: 4px;
}

.contact-info-license {
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
  margin-bottom: 18px;
}

.contact-info-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.contact-info-list a,
.contact-info-address {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--fs-sm);
  color: var(--color-teal);
  line-height: 1.5;
}

.contact-info-address {
  color: var(--color-text-secondary);
}

.contact-info-list a:hover {
  color: var(--color-teal-dark);
}

.contact-info-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 2px;
}

.page-hero--contact {
  padding-bottom: 88px;
}

.page-hero--contact h1 {
  max-width: 7.8em;
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.float-stat {
  position: absolute;
  right: -12px;
  bottom: -36px;
  width: 260px;
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-float);
  padding: 18px 20px;
  z-index: 2;
}

.float-stat .num {
  font-size: 28px;
  font-weight: 700;
  color: var(--color-teal);
  margin-bottom: 6px;
  line-height: 1.2;
}

.float-stat.accent-blue .num {
  color: var(--color-teal);
}

.float-stat.accent-blue {
  width: 260px;
}

.float-stat p {
  font-size: 12px;
  color: var(--color-text-secondary);
  margin: 0;
  line-height: 1.55;
}

.coverage-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.coverage-review-card h3 {
  font-size: var(--fs-lg);
  margin-bottom: 10px;
}

.coverage-review-card p {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.65;
  margin: 0;
}

.section-prep {
  background: var(--color-navy-deeps);
  color: #fff;
}

.section-prep .section-title {
  color: #fff;
  margin-bottom: 0;
  max-width: 480px;
}

.section-prep .feature-list {
  margin-top: 0;
  gap: 14px;
}

.prep-list .feature-item {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 14px 20px;
  border-radius: 999px;
  align-items: center;
}

.prep-list .feature-item .icon-dot {
  width: 24px;
  height: 24px;
  background: rgba(67, 185, 172, 0.2);
  color: var(--color-teal);
  font-size: 13px;
}

.prep-list .feature-item span:last-child {
  color: #fff;
  font-size: 15px;
}

.section-disclosure {
  padding: 40px 0;
  background: var(--color-white);
}

.hero-media {
  position: relative;
}

.hero-media img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  border-radius: var(--radius-lg);
}

@media (max-width: 900px) {

  .two-col,
  .two-col-form,
  .steps-row,
  .resource-grid,
  .contact-grid,
  .grid-3,
  .coverage-grid,
  .article-layout {
    grid-template-columns: 1fr;
  }

  .article-consult {
    position: static;
  }

  .article-body {
    padding-top: 40px;
    padding-bottom: 64px;
  }

  .article-layout {
    gap: 36px;
  }

  .content-section {
    padding: 48px 0;
  }

  .section-prep .two-col {
    gap: 28px;
    align-items: start;
  }

  .section-prep .section-title {
    max-width: none;
  }

  .float-stat {
    position: relative;
    right: auto;
    bottom: auto;
    width: 92%;
    margin-top: -28px;
    padding: 18px 20px;
    left: 50%;
    transform: translateX(-50%);
  }

  .hero-media img {
    height: 240px;
  }

  .page-hero .two-col {
    gap: 28px;
  }
}

@media (max-width: 768px) {
  .content-section {
    padding: 40px 0;
  }

  .section-disclosure {
    padding: 32px 0;
  }

  .section-resources {
    padding-top: 8px;
    padding-bottom: 48px;
  }

  .section-head {
    margin-bottom: 28px;
  }

  .coverage-grid {
    gap: 16px;
  }

  .coverage-review-card {
    padding: 22px 20px;
  }

  .resource-grid {
    gap: 16px;
  }

  .resource-card {
    padding: 22px 20px;
  }

  .contact-info-card {
    max-width: none;
  }

  .page-hero--contact h1 {
    max-width: none;
  }

  .page-hero--contact {
    padding-bottom: 48px;
  }

  .prep-list .feature-item {
    padding: 13px 16px;
  }

  .page-hero .btn-lg {
    width: 100%;
  }

  .article-hero h1 {
    max-width: none;
  }

  .article-body {
    padding-top: 28px;
    padding-bottom: 48px;
  }

  .article-point {
    padding: 22px 0;
  }

  .article-point h2 {
    font-size: var(--fs-xl);
  }

  .article-consult {
    padding: 24px 20px;
  }

  .faq-section {
    padding-top: 24px;
    padding-bottom: 56px;
  }

  .faq-wrap {
    max-width: none;
  }

  .faq-wrap .accordion-trigger {
    padding: 20px 0;
    font-size: var(--fs-md);
  }

  .faq-wrap .accordion-item.is-open .accordion-trigger {
    padding-bottom: 8px;
  }

  .faq-wrap .accordion-panel {
    padding: 0 28px 20px 0;
  }

  .about-hero h1 {
    max-width: none;
  }

  .about-hero p {
    max-width: none;
  }

  .about-values {
    padding-top: 12px;
    padding-bottom: 48px;
  }

  .about-value-card {
    padding: 24px 20px 28px;
  }

  .content-section.legal-body {
    padding-top: 28px;
    padding-bottom: 48px;
  }

  .legal-content {
    max-width: none;
  }

  .legal-point {
    padding: 22px 0;
  }

  .legal-point h2 {
    font-size: var(--fs-xl);
  }

  .legal-designer-note {
    margin-top: 28px;
  }
}

/* ===== Inner page motion ===== */

/* page-hero entrance */
.page-hero .section-label,
.page-hero h1,
.page-hero .page-hero-copy>p,
.page-hero .contact-copy>p,
.page-hero>.container>p,
.page-hero .two-col-form>div:first-child>p,
.page-hero .page-hero-copy>.btn,
.page-hero .contact-copy>.btn,
.page-hero>.container>.btn,
.page-hero .two-col-form>div:first-child>.btn,
.page-hero .form-note,
.page-hero .hero-media,
.page-hero .float-stat,
.page-hero .contact-info-card,
.page-hero .form-card {
  animation: hero-fade-up var(--dur-enter) var(--ease-out) both;
}

.page-hero .section-label {
  animation-delay: 0.05s;
}

.page-hero h1 {
  animation-delay: 0.14s;
}

.page-hero .page-hero-copy>p,
.page-hero .contact-copy>p,
.page-hero>.container>p,
.page-hero .two-col-form>div:first-child>p {
  animation-delay: 0.24s;
}

.page-hero .page-hero-copy>.btn,
.page-hero .contact-copy>.btn,
.page-hero>.container>.btn,
.page-hero .two-col-form>div:first-child>.btn,
.page-hero .form-note {
  animation-delay: 0.34s;
}

.page-hero .hero-media {
  animation-delay: 0.22s;
}

.page-hero .form-card {
  animation-delay: 0.28s;
}

.page-hero .contact-info-card {
  animation-delay: 0.38s;
}

.page-hero .float-stat {
  animation-delay: 0.42s;
}

/* Card / form / FAQ hover */
.coverage-review-card,
.resource-card,
.about-value-card {
  transition: transform 0.32s var(--ease-out), box-shadow 0.32s var(--ease-out);
}

.coverage-review-card:hover,
.resource-card:hover,
.about-value-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
}

.article-point {
  transition: transform 0.28s var(--ease-out);
}

.article-point:hover {
  transform: translateX(4px);
}

.article-consult {
  transition: box-shadow 0.32s var(--ease-out);
}

.article-consult:hover {
  box-shadow: var(--shadow-card-hover);
}

.resource-card .text-link .chevron {
  transition: transform var(--transition);
}

.resource-card:hover .text-link .chevron,
.resource-card .text-link:hover .chevron {
  transform: translateX(3px);
}

.page-hero .form-card,
.content-section .form-card {
  transition: box-shadow 0.32s var(--ease-out);
}

.page-hero .form-card:hover,
.content-section .form-card:hover {
  box-shadow: var(--shadow-card-hover);
}

.faq-wrap .accordion-item {
  transition: background-color var(--transition), border-color var(--transition);
}

.faq-wrap .accordion-item:hover {
  background-color: rgba(67, 185, 172, 0.04);
}

.prep-list .feature-item {
  transition: transform 0.28s var(--ease-out), background-color var(--transition), border-color var(--transition);
}

.prep-list .feature-item:hover {
  transform: translateX(4px);
}

@media (max-width: 960px) {
  .page-hero .float-stat {
    animation-name: hero-fade-in;
  }
}

@media (prefers-reduced-motion: reduce) {

  .page-hero .section-label,
  .page-hero h1,
  .page-hero .page-hero-copy>p,
  .page-hero .contact-copy>p,
  .page-hero>.container>p,
  .page-hero .two-col-form>div:first-child>p,
  .page-hero .page-hero-copy>.btn,
  .page-hero .contact-copy>.btn,
  .page-hero>.container>.btn,
  .page-hero .two-col-form>div:first-child>.btn,
  .page-hero .form-note,
  .page-hero .hero-media,
  .page-hero .float-stat,
  .page-hero .contact-info-card,
  .page-hero .form-card {
    animation: none;
  }

  .coverage-review-card:hover,
  .resource-card:hover,
  .about-value-card:hover,
  .article-point:hover,
  .prep-list .feature-item:hover {
    transform: none;
  }

  .article-consult:hover {
    box-shadow: none;
  }
}