/* Shared, page-scoped styles for editorial and commercial SEO content pages. */
.arw-seo-content-page {
  --arw-seo-navy: #102f5f;
  --arw-seo-blue: #0798dc;
  --arw-seo-ink: #263d5b;
  --arw-seo-muted: #536c8a;
  --arw-seo-line: #dcebf5;
  --arw-seo-soft: #eef8fd;
  color: var(--arw-seo-ink);
}
.arw-seo-content-page .arw-seo-content-main { overflow: hidden; }
.arw-seo-content-page .arw-seo-content-main > section > .container { width: 100%; max-width: 1320px; padding-inline: 0; }
.arw-seo-content-page .arw-seo-lead-band { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(110deg, #f3faff 0%, #e9f6fd 68%, #dff3fd 100%); }
.arw-seo-content-page .arw-seo-lead-band::before { position: absolute; z-index: 0; top: -230px; right: 7%; width: 460px; height: 460px; border: 1px solid rgba(7, 152, 220, .07); border-radius: 50%; background: radial-gradient(circle, rgba(7, 152, 220, .055) 0 42%, transparent 43%); content: ""; pointer-events: none; }
.arw-seo-content-page .arw-seo-lead-band::after { position: absolute; z-index: 0; right: 2%; bottom: 5%; width: min(36vw, 440px); height: 150px; background: linear-gradient(to top, rgba(7,152,220,.075) 0 35%, transparent 35%) 0 100% / 34px 100% no-repeat, linear-gradient(to top, rgba(7,152,220,.06) 0 58%, transparent 58%) 42px 100% / 34px 100% no-repeat, linear-gradient(to top, rgba(7,152,220,.07) 0 78%, transparent 78%) 84px 100% / 34px 100% no-repeat, linear-gradient(to top, rgba(7,152,220,.05) 0 48%, transparent 48%) 126px 100% / 34px 100% no-repeat, linear-gradient(to top, rgba(7,152,220,.065) 0 68%, transparent 68%) 168px 100% / 34px 100% no-repeat, linear-gradient(to top, rgba(7,152,220,.05) 0 42%, transparent 42%) 210px 100% / 34px 100% no-repeat; content: ""; opacity: .8; pointer-events: none; }
.arw-seo-content-page .arw-seo-lead-band > .arw-seo-breadcrumb-band, .arw-seo-content-page .arw-seo-lead-band > .arw-seo-content-main > .arw-seo-hero { position: relative; z-index: 1; background: transparent; }
.arw-seo-content-page .arw-seo-breadcrumb { display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; }
.arw-seo-content-page .arw-seo-breadcrumb a { color: var(--arw-seo-blue); }
.arw-seo-content-page .arw-seo-breadcrumb span { color: var(--arw-seo-muted); }
.arw-seo-content-page .arw-seo-hero { position: relative; background: transparent; }
.arw-seo-content-page .arw-seo-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: clamp(32px, 5vw, 76px); min-height: 0; padding-top: 40px; padding-bottom: 40px; }
.arw-seo-content-page .arw-seo-hero-copy { max-width: 590px; }
.arw-seo-content-page .arw-eyebrow { margin: 0 0 12px; color: var(--arw-seo-blue); font-size: 12px; font-weight: 700; letter-spacing: .12em; line-height: 1.5; text-transform: uppercase; }
.arw-seo-content-page .arw-seo-hero h1 { margin: 0 0 16px; color: var(--arw-seo-navy); font-size: clamp(34px, 3.1vw, 48px); font-weight: 800; letter-spacing: -.035em; line-height: 1.08; }
.arw-seo-content-page .arw-seo-hero-copy > p:not(.arw-eyebrow), .arw-seo-content-page .arw-seo-section-heading > p:not(.arw-eyebrow), .arw-seo-content-page .arw-seo-content-paragraph { color: var(--arw-seo-muted); font-size: 16px; line-height: 1.65; }
.arw-seo-content-page .arw-seo-hero-lead { color: var(--arw-seo-navy) !important; font-size: 18px !important; }
.arw-seo-content-page .arw-seo-hero-art { margin: 0; min-width: 0; }
.arw-seo-content-page .arw-seo-hero-art img { display: block; width: 100%; max-height: 430px; height: auto; object-fit: contain; border-radius: 18px; }
.arw-seo-content-page .arw-seo-hero-art--large img { width: 138%; max-width: none; max-height: 520px; }
@media (max-width: 1199px) and (min-width: 992px) { .arw-seo-content-page .arw-seo-hero-art--large img { width: 120%; max-height: 460px; } }
.arw-seo-content-page .arw-seo-hero-actions, .arw-seo-content-page .arw-seo-cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 24px; }
.arw-seo-content-page .arw-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 9px; padding: 12px 20px; border-radius: 28px; font-weight: 700; text-decoration: none; }
.arw-seo-content-page .arw-button-primary { color: #fff; background: linear-gradient(100deg, #12aae5, #087fbd); box-shadow: 0 8px 22px rgba(0, 145, 207, .2); }
.arw-seo-content-page .arw-button-light { color: var(--arw-seo-blue); background: #fff; }
.arw-seo-content-page .arw-button-outline { border: 1px solid var(--arw-seo-blue); color: var(--arw-seo-blue); background: #fff; }
.arw-seo-content-page .arw-button-outline:hover { color: #066f9d; background: #f1faff; }
.arw-seo-content-page .arw-text-link, .arw-seo-content-page .arw-seo-cta-actions > a:not(.arw-button) { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--arw-seo-blue); font-weight: 700; text-decoration: none; }
.arw-seo-content-page .arw-seo-section { padding: 80px 0; }
.arw-seo-content-page .arw-seo-section-soft { background: #fff; }
.arw-seo-content-page .arw-seo-section-heading { max-width: 850px; margin: 0 0 24px; }
.arw-seo-content-page .arw-seo-section-heading-left { margin-left: 0; }
.arw-seo-content-page .arw-seo-section-heading h2 { margin: 0 0 8px; color: var(--arw-seo-navy); font-size: clamp(27px, 2.35vw, 34px); font-weight: 800; letter-spacing: -.025em; line-height: 1.16; }
.arw-seo-content-page .arw-seo-section-heading > p:last-child { margin-bottom: 0; }
.arw-seo-content-page .arw-seo-intro { background: #fff; }
.arw-seo-content-page .arw-seo-intro-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); align-items: start; gap: 48px; }
.arw-seo-content-page .arw-seo-intro-grid .arw-seo-section-heading { margin-bottom: 0; }
.arw-seo-content-page .arw-seo-copy > p { margin: 0 0 14px; color: var(--arw-seo-muted); line-height: 1.65; }
.arw-seo-content-page .arw-seo-concepts, .arw-seo-content-page .arw-seo-note, .arw-seo-content-page .arw-seo-example-checks, .arw-seo-content-page .arw-seo-example-table-wrap { border: 1px solid #e1f0f8; border-radius: 14px; background: linear-gradient(135deg, #f1f9fd, #e8f6fc); }
.arw-seo-content-page .arw-seo-concepts { display: grid; grid-template-columns: 42px 1fr; gap: 14px; padding: 22px; }
.arw-seo-content-page .arw-seo-concepts-icon { color: var(--arw-seo-blue); font-size: 28px; }
.arw-seo-content-page .arw-seo-concepts h3, .arw-seo-content-page .arw-seo-note h3, .arw-seo-content-page .arw-seo-example-checks h3, .arw-seo-content-page .arw-seo-example-table-wrap h3 { margin: 0 0 12px; color: var(--arw-seo-navy); font-size: 18px; font-weight: 700; }
.arw-seo-content-page .arw-seo-concepts ul, .arw-seo-content-page .arw-seo-example-checks ul { margin: 0; padding: 0; list-style: none; }
.arw-seo-content-page .arw-seo-concepts li, .arw-seo-content-page .arw-seo-example-checks li { display: flex; gap: 9px; margin: 9px 0; line-height: 1.5; }
.arw-seo-content-page .arw-seo-concepts li i, .arw-seo-content-page .arw-seo-example-checks li i { flex: 0 0 auto; color: var(--arw-seo-blue); }
.arw-seo-content-page .arw-seo-card-grid { display: grid; gap: 16px; }
.arw-seo-content-page .arw-seo-card-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.arw-seo-content-page .arw-seo-card-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.arw-seo-content-page .arw-seo-card-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.arw-seo-content-page .arw-seo-card { min-width: 0; padding: 18px; border: 1px solid var(--arw-seo-line); border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(19, 70, 111, .035); }
.arw-seo-content-page .arw-seo-card-icon, .arw-seo-content-page .arw-seo-step-icon { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; margin-bottom: 12px; border-radius: 12px; background: #eaf6fd; color: var(--arw-seo-blue); font-size: 22px; }
.arw-seo-content-page .arw-seo-card-icon.tone-orange { background: #fff2e7; color: #f18a24; }
.arw-seo-content-page .arw-seo-card-icon.tone-purple { background: #f2eaff; color: #8250df; }
.arw-seo-content-page .arw-seo-card-icon.tone-green { background: #e9f9f0; color: #15a566; }
.arw-seo-content-page .arw-seo-card h3 { margin: 0 0 8px; color: var(--arw-seo-navy); font-size: 17px; font-weight: 700; }
.arw-seo-content-page .arw-seo-card p, .arw-seo-content-page .arw-seo-step p { margin: 0; color: var(--arw-seo-muted); line-height: 1.55; }
.arw-seo-content-page .arw-seo-steps { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.arw-seo-content-page .arw-seo-step { position: relative; min-width: 0; padding: 16px 14px; border: 1px solid var(--arw-seo-line); border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(19, 70, 111, .035); }
.arw-seo-content-page .arw-seo-step-number { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; margin: 0 10px 12px 0; border-radius: 50%; background: var(--arw-seo-blue); color: #fff; font-weight: 700; }
.arw-seo-content-page .arw-seo-step h3 { margin: 0 0 8px; color: var(--arw-seo-navy); font-size: 14px; font-weight: 700; line-height: 1.35; }
.arw-seo-content-page .arw-seo-step p { font-size: 13px; line-height: 1.45; }
.arw-seo-content-page .arw-seo-note { display: grid; grid-template-columns: 42px 1fr; gap: 14px; margin-top: 24px; padding: 18px 20px; }
.arw-seo-content-page .arw-seo-note-icon { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: #fff0e8; color: #ef6c36; font-size: 22px; }
.arw-seo-content-page .arw-seo-note h3 { margin-bottom: 5px; }
.arw-seo-content-page .arw-seo-note p { margin: 0; color: var(--arw-seo-muted); line-height: 1.6; }
.arw-seo-content-page .arw-seo-inline-cards { margin-top: 24px; }
.arw-seo-content-page .arw-seo-content-grid { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 22px; }
.arw-seo-content-page .arw-seo-content-grid.has-note { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .8fr); }
.arw-seo-content-page .arw-seo-content-main-column { min-width: 0; }
.arw-seo-content-page .arw-seo-content-grid .arw-seo-note { margin-top: 0; }
.arw-seo-content-page .arw-seo-section-pair { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr); align-items: start; gap: 28px; width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 0 72px; }
.arw-seo-content-page .arw-seo-section-pair > .arw-seo-section { min-width: 0; padding: 0; background: transparent; }
.arw-seo-content-page .arw-seo-section-pair > .arw-seo-section > .container { width: 100%; max-width: none; padding: 0; }
.arw-seo-content-page .arw-seo-section-pair .arw-seo-section-heading { margin: 0 0 20px; }
.arw-seo-content-page .arw-seo-example-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 20px; }
.arw-seo-content-page .arw-seo-example-checks, .arw-seo-content-page .arw-seo-example-table-wrap { padding: 22px; }
.arw-seo-content-page .arw-seo-example-table-wrap h3 small { display: block; margin-top: 4px; color: var(--arw-seo-muted); font-size: 12px; font-weight: 400; }
.arw-seo-content-page .arw-seo-example-table, .arw-seo-content-page .arw-seo-comparison-table { width: 100%; border-collapse: collapse; background: #fff; }
.arw-seo-content-page .arw-seo-example-table th, .arw-seo-content-page .arw-seo-example-table td, .arw-seo-content-page .arw-seo-comparison-table th, .arw-seo-content-page .arw-seo-comparison-table td { padding: 11px 13px; border: 1px solid var(--arw-seo-line); text-align: left; }
.arw-seo-content-page .arw-seo-example-table th { color: var(--arw-seo-ink); font-weight: 500; }
.arw-seo-content-page .arw-seo-example-table td { color: var(--arw-seo-navy); font-weight: 700; white-space: nowrap; }
.arw-seo-content-page .arw-seo-example-table .is-highlighted { background: #fff2e9; color: #d64a19; }
.arw-seo-content-page .arw-seo-table-wrap { overflow-x: auto; border: 1px solid var(--arw-seo-line); border-radius: 10px; }
.arw-seo-content-page .arw-seo-comparison-table thead { color: #fff; background: #078ecb; }
.arw-seo-content-page .arw-seo-comparison-table th, .arw-seo-content-page .arw-seo-comparison-table td { min-width: 150px; }
.arw-seo-content-page .arw-seo-comparison-table tbody th { color: var(--arw-seo-navy); background: #f5fafe; }
.arw-seo-content-page .arw-faq-section { padding: 54px 0 44px; background: linear-gradient(110deg, #fff 0%, #f7fbfe 100%); }
.arw-seo-content-page .arw-faq-section .arw-eyebrow { margin: 0 0 8px; color: #087fc2; font-size: 13px; font-weight: 800; letter-spacing: .07em; }
.arw-seo-content-page .arw-faq-section h2 { margin: 0 0 12px; color: var(--arw-seo-navy); font-family: var(--heading-font); font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.15; }
.arw-seo-content-page .arw-seo-faq-layout { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr); gap: 48px; }
.arw-seo-content-page .arw-seo-faq-list details { margin: 0 0 10px; border: 1px solid var(--arw-seo-line); border-radius: 9px; background: #fff; }
.arw-seo-content-page .arw-seo-faq-list summary { position: relative; padding: 15px 44px 15px 17px; color: var(--arw-seo-navy); cursor: pointer; font-weight: 600; list-style: none; }
.arw-seo-content-page .arw-seo-faq-list summary::-webkit-details-marker { display: none; }
.arw-seo-content-page .arw-seo-faq-list summary::after { position: absolute; top: 50%; right: 18px; color: var(--arw-seo-blue); content: '+'; font-size: 20px; transform: translateY(-50%); }
.arw-seo-content-page .arw-seo-faq-list details[open] summary::after { content: '−'; }
.arw-seo-content-page .arw-seo-faq-list details p { margin: 0; padding: 0 17px 16px; color: var(--arw-seo-muted); line-height: 1.6; }
.arw-seo-content-page .arw-seo-cta { padding: 64px 0; background: #f4f9fc; }
.arw-seo-content-page .arw-seo-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 32px; border: 1px solid var(--arw-seo-line); border-radius: 16px; background: linear-gradient(110deg, #fff 0%, #eef8fd 100%); }
.arw-seo-content-page .arw-seo-cta-copy { min-width: 0; }
.arw-seo-content-page .arw-seo-cta-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; }
@media (max-width: 991px) {
  .arw-seo-content-page .arw-seo-hero-grid { grid-template-columns: 1fr 1fr; gap: 28px; min-height: 0; }
  .arw-seo-content-page .arw-seo-card-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arw-seo-content-page .arw-seo-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .arw-seo-content-page .arw-seo-intro-grid { gap: 28px; }
  .arw-seo-content-page .arw-seo-content-grid.has-note { grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr); }
  .arw-seo-content-page .arw-seo-section-pair { gap: 20px; }
  .arw-seo-content-page .arw-seo-cta-inner { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 767px) {
  .arw-seo-content-page .arw-seo-breadcrumb { min-height: 40px; font-size: 13px; }
  .arw-seo-content-page .arw-seo-hero-grid { grid-template-columns: 1fr; gap: 26px; padding-top: 30px; padding-bottom: 34px; }
  .arw-seo-content-page .arw-seo-hero-copy { max-width: none; }
  .arw-seo-content-page .arw-seo-hero h1 { font-size: clamp(32px, 8vw, 40px); }
  .arw-seo-content-page .arw-seo-hero-art { max-width: 560px; }
  .arw-seo-content-page .arw-seo-lead-band::before { top: -180px; right: -230px; width: 360px; height: 360px; }
  .arw-seo-content-page .arw-seo-lead-band::after { right: -90px; width: 300px; height: 110px; opacity: .5; }
  .arw-seo-content-page .arw-seo-section { padding: 56px 0; }
  .arw-seo-content-page .arw-seo-section-heading { margin-bottom: 22px; }
  .arw-seo-content-page .arw-seo-intro-grid, .arw-seo-content-page .arw-seo-example-grid, .arw-seo-content-page .arw-seo-faq-layout { grid-template-columns: 1fr; gap: 24px; }
  .arw-seo-content-page .arw-seo-content-grid.has-note, .arw-seo-content-page .arw-seo-section-pair { grid-template-columns: 1fr; }
  .arw-seo-content-page .arw-seo-section-pair { padding-bottom: 56px; }
  .arw-seo-content-page .arw-seo-intro-grid .arw-seo-section-heading { margin-bottom: 0; }
  .arw-seo-content-page .arw-seo-card-grid-3, .arw-seo-content-page .arw-seo-card-grid-4, .arw-seo-content-page .arw-seo-steps { grid-template-columns: 1fr; }
  .arw-seo-content-page .arw-seo-card-grid-2 { grid-template-columns: 1fr; }
  .arw-seo-content-page .arw-seo-card, .arw-seo-content-page .arw-seo-step { padding: 18px; }
  .arw-seo-content-page .arw-seo-concepts, .arw-seo-content-page .arw-seo-note { grid-template-columns: 32px 1fr; gap: 10px; padding: 16px; }
  .arw-seo-content-page .arw-seo-example-checks, .arw-seo-content-page .arw-seo-example-table-wrap { padding: 16px; }
  .arw-seo-content-page .arw-seo-example-table th, .arw-seo-content-page .arw-seo-example-table td { padding: 9px 8px; font-size: 13px; }
  .arw-seo-content-page .arw-seo-example-table td { white-space: normal; }
  .arw-seo-content-page .arw-seo-cta { padding: 48px 0; }
  .arw-seo-content-page .arw-seo-cta-actions { align-items: stretch; width: 100%; }
  .arw-seo-content-page .arw-seo-cta-actions .arw-button { width: 100%; }
}

@media (max-width: 991px) { .arw-seo-content-page .arw-seo-hero-art--large img { width: 100%; max-height: 430px; } }

@media (max-width: 1367px) {
  .arw-seo-content-page .arw-seo-content-main > section > .container { width: calc(100% - 48px); }
  .arw-seo-content-page .arw-seo-section-pair { width: calc(100% - 48px); }
}



@media (max-width: 767px) {
  .arw-seo-content-page .arw-seo-hero-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .arw-seo-content-page .arw-seo-hero-actions .arw-button {
    max-width: 100%;
    white-space: normal;
  }
}