.seo-body { background: radial-gradient(circle at 80% 7%, rgba(177,126,35,.12), transparent 26rem), radial-gradient(circle at 7% 28%, rgba(8,111,88,.1), transparent 28rem), #030e19; }
.seo-breadcrumb { display: flex; gap: 9px; align-items: center; padding-top: 26px; color: #71838e; font-size: 11px; }
.seo-breadcrumb a { color: #cba954; }
.seo-hero { position: relative; padding: 62px 0 70px; overflow: hidden; }
.seo-hero--compact { padding-bottom: 45px; }
.seo-hero--compact .seo-hero__art { min-height: 240px; }
.seo-hero--compact .seo-hero__art .icon-3d { width: 300px; height: 200px; }
.seo-hero::before { content: ""; position: absolute; inset: 0; opacity: .15; background-image: linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, #000, transparent); pointer-events: none; }
.seo-hero__grid { position: relative; display: grid; grid-template-columns: 1.15fr .6fr; gap: 70px; align-items: center; }
.seo-label { display: inline-flex; align-items: center; gap: 8px; padding: 7px 11px; color: #e7c874; border: 1px solid rgba(243,199,95,.25); border-radius: 999px; background: rgba(243,199,95,.055); font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.seo-label::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #6dd3a8; box-shadow: 0 0 9px #6dd3a8; }
.seo-hero h1 { margin: 22px 0 20px; font-size: clamp(44px, 5.2vw, 72px); line-height: 1.03; letter-spacing: -.055em; }
.seo-hero h1 em { color: var(--gold); font-style: normal; }
.seo-hero__lede { max-width: 760px; color: #a9b6bd; font-size: 17px; line-height: 1.8; }
.seo-hero__meta { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-top: 24px; color: #71838e; font-size: 10px; }
.seo-hero__meta span { display: inline-flex; gap: 7px; align-items: center; }
.seo-hero__meta b { color: #d8ba6e; }
.seo-hero__art { position: relative; min-height: 340px; display: grid; place-items: center; }
.seo-hero__art::before { content: ""; position: absolute; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(200,151,48,.24), rgba(16,112,88,.1) 42%, transparent 70%); }
.seo-hero__art .icon-3d { width: 390px; height: 260px; transform: scale(1.06); }
.seo-hero__art .seo-shield-badge { position: absolute; right: 10px; bottom: 38px; width: 76px; height: 76px; display: grid; place-items: center; color: #07120e; border: 5px solid #0a2731; border-radius: 50%; background: linear-gradient(145deg, #96ecc8, #39aa7b); box-shadow: 0 18px 35px rgba(0,0,0,.4); font-size: 22px; font-weight: 800; }
.seo-disclosure { position: relative; z-index: 2; display: grid; grid-template-columns: auto 1fr; gap: 14px; margin-top: 38px; padding: 17px 19px; border: 1px solid rgba(243,199,95,.18); border-radius: 13px; background: rgba(12,29,40,.8); color: #8999a2; font-size: 11px; line-height: 1.6; }
.seo-disclosure strong { color: #e7cc86; }
.seo-disclosure > span { width: 26px; height: 26px; display: grid; place-items: center; color: #07140e; border-radius: 50%; background: #65c79f; font-weight: 800; }

.seo-page { padding-bottom: 90px; }
.trust-content { max-width: 900px; }
.trust-content .seo-article { padding: 30px 38px; border: 1px solid rgba(255,255,255,.08); border-radius: 20px; background: rgba(7,24,36,.72); box-shadow: 0 25px 55px rgba(0,0,0,.2); }
.seo-page__layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; align-items: start; }
.seo-article { min-width: 0; }
.seo-summary { margin-bottom: 35px; padding: 28px 30px; border: 1px solid rgba(80,167,133,.27); border-radius: 18px; background: linear-gradient(135deg, rgba(10,55,48,.72), rgba(8,29,40,.82)); }
.seo-summary > span { color: #73d3ad; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; }
.seo-summary h2 { margin: 9px 0 12px; font-size: 23px; }
.seo-summary p { margin: 0; color: #a5b6b8; font-size: 13px; line-height: 1.75; }
.seo-article section { scroll-margin-top: 110px; padding: 14px 0 25px; }
.seo-article h2 { margin: 0 0 17px; padding-top: 10px; font-size: clamp(27px, 3vw, 38px); line-height: 1.18; letter-spacing: -.04em; }
.seo-article h3 { margin: 27px 0 11px; font-size: 20px; letter-spacing: -.025em; }
.seo-article p, .seo-article li { color: #9cabb3; font-size: 14px; line-height: 1.85; }
.seo-article p { margin: 0 0 18px; }
.seo-article strong { color: #e8ecea; }
.seo-article a { color: #e5bd58; text-decoration: underline; text-decoration-color: rgba(229,189,88,.35); text-underline-offset: 3px; }
.seo-article ul, .seo-article ol { margin: 14px 0 22px; padding-left: 23px; }
.seo-article li + li { margin-top: 9px; }
.seo-article hr { height: 1px; margin: 35px 0; border: 0; background: linear-gradient(90deg, transparent, rgba(243,199,95,.28), transparent); }
.seo-callout { margin: 24px 0; padding: 22px 24px; border-left: 3px solid var(--gold); border-radius: 0 13px 13px 0; background: rgba(243,199,95,.055); }
.seo-callout--danger { border-left-color: #d7695d; background: rgba(173,72,62,.08); }
.seo-callout--safe { border-left-color: #57c99a; background: rgba(50,160,116,.08); }
.seo-callout h3 { margin-top: 0; }
.seo-callout p:last-child { margin-bottom: 0; }
.seo-checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 22px 0 28px; }
.seo-check { display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: start; padding: 16px; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; background: rgba(255,255,255,.025); }
.seo-check > span { width: 24px; height: 24px; display: grid; place-items: center; color: #0b1b14; border-radius: 50%; background: #60c89d; font-size: 11px; font-weight: 800; }
.seo-check strong { display: block; margin-bottom: 4px; font-size: 12px; }
.seo-check small { color: #7f9099; font-size: 10px; line-height: 1.5; }
.seo-table-wrap { margin: 24px 0 30px; overflow-x: auto; border: 1px solid rgba(255,255,255,.09); border-radius: 15px; }
.seo-table { width: 100%; min-width: 620px; border-collapse: collapse; background: rgba(7,23,35,.75); }
.seo-table th, .seo-table td { padding: 15px 17px; border-bottom: 1px solid rgba(255,255,255,.07); text-align: left; vertical-align: top; }
.seo-table th { color: #efd37f; background: rgba(243,199,95,.055); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.seo-table td { color: #93a3ac; font-size: 11px; line-height: 1.55; }
.seo-table tr:last-child td { border-bottom: 0; }
.seo-steps { counter-reset: safe-step; display: grid; gap: 13px; margin: 22px 0 30px; }
.seo-step { position: relative; padding: 18px 20px 18px 65px; border: 1px solid rgba(255,255,255,.085); border-radius: 14px; background: rgba(8,27,40,.68); }
.seo-step::before { counter-increment: safe-step; content: counter(safe-step); position: absolute; left: 18px; top: 18px; width: 31px; height: 31px; display: grid; place-items: center; color: #09130e; border-radius: 9px; background: linear-gradient(145deg, #f8da82, #c58b2f); font-size: 12px; font-weight: 800; box-shadow: 0 8px 15px rgba(0,0,0,.25); }
.seo-step strong { display: block; margin-bottom: 5px; font-size: 13px; }
.seo-step p { margin: 0; font-size: 11px; line-height: 1.65; }
.seo-faq { display: grid; gap: 10px; margin-top: 22px; }
.seo-faq .faq-item button { font-size: 13px; }
.seo-faq .faq-answer p { font-size: 12px; }
.seo-sources { margin-top: 30px; padding: 24px; border: 1px solid rgba(255,255,255,.08); border-radius: 15px; background: rgba(255,255,255,.02); }
.seo-sources h2 { font-size: 22px; }
.seo-sources li { font-size: 11px; }

.seo-sidebar { position: sticky; top: 105px; display: grid; gap: 17px; }
.seo-toc, .seo-side-card { padding: 22px; border: 1px solid rgba(255,255,255,.085); border-radius: 16px; background: rgba(8,26,39,.9); box-shadow: 0 20px 45px rgba(0,0,0,.18); }
.seo-toc > span, .seo-side-card > span { color: #c6a24c; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .13em; }
.seo-toc h2, .seo-side-card h2 { margin: 8px 0 14px; font-size: 17px; }
.seo-toc nav { display: grid; gap: 2px; }
.seo-toc nav a { padding: 8px 0; color: #83949e; border-bottom: 1px solid rgba(255,255,255,.055); font-size: 10px; line-height: 1.4; transition: color .2s ease, padding-left .2s ease; }
.seo-toc nav a:hover { padding-left: 5px; color: var(--gold); }
.seo-toc nav a:last-child { border-bottom: 0; }
.seo-side-card p { color: #84959e; font-size: 10px; line-height: 1.65; }
.seo-side-card .btn { width: 100%; min-height: 42px; padding-inline: 12px; font-size: 10px; }
.seo-side-card--alert { border-color: rgba(206,83,72,.27); background: linear-gradient(145deg, rgba(67,28,32,.38), rgba(9,26,38,.92)); }
.seo-side-icon { width: 120px; height: 80px; margin: -4px auto 5px; }

.seo-next { padding: 55px 0; border-block: 1px solid rgba(255,255,255,.07); background: linear-gradient(115deg, rgba(10,51,45,.48), rgba(30,23,44,.42)); }
.seo-next__inner { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.seo-next__inner > div > span { color: #b5954d; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .15em; }
.seo-next__inner h2 { margin: 7px 0 0; font-size: 25px; }
.seo-next__links { display: flex; gap: 9px; flex-wrap: wrap; }
.seo-next__links a { padding: 11px 14px; color: #e9d08d; border: 1px solid rgba(243,199,95,.22); border-radius: 9px; background: rgba(3,14,25,.38); font-size: 10px; font-weight: 800; }
.seo-footer-grid { grid-template-columns: 2fr repeat(3, 1fr); }

@media (max-width: 980px) {
  .seo-hero__grid { grid-template-columns: 1fr .55fr; gap: 25px; }
  .seo-page__layout { grid-template-columns: 1fr; }
  .seo-sidebar { position: static; grid-template-columns: 1fr 1fr; }
  .seo-toc { grid-column: 1 / -1; }
  .seo-toc nav { grid-template-columns: 1fr 1fr; column-gap: 24px; }
}

@media (max-width: 760px) {
  .seo-breadcrumb { padding-top: 20px; }
  .seo-hero { padding: 42px 0 52px; }
  .seo-hero__grid { grid-template-columns: 1fr; text-align: center; }
  .seo-hero h1 { font-size: clamp(40px, 12vw, 60px); }
  .seo-hero__lede { font-size: 14px; }
  .seo-hero__meta { justify-content: center; }
  .seo-hero__art { min-height: 250px; }
  .seo-hero__art .icon-3d { width: 315px; height: 210px; }
  .seo-hero--compact .seo-hero__art { min-height: 190px; }
  .seo-hero--compact .seo-hero__art .icon-3d { width: 255px; height: 170px; }
  .seo-disclosure { text-align: left; }
  .seo-page__layout { gap: 38px; }
  .seo-summary { padding: 22px; }
  .trust-content .seo-article { padding: 22px; }
  .seo-article p, .seo-article li { font-size: 13px; }
  .seo-checklist { grid-template-columns: 1fr; }
  .seo-sidebar { grid-template-columns: 1fr; }
  .seo-toc { grid-column: auto; }
  .seo-toc nav { grid-template-columns: 1fr; }
  .seo-next__inner { display: grid; text-align: center; }
  .seo-next__links { justify-content: center; }
  .seo-footer-grid { grid-template-columns: 1fr 1fr; }
  .seo-footer-grid .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 430px) {
  .seo-hero__art .icon-3d { width: 270px; height: 180px; }
  .seo-hero__art .seo-shield-badge { right: 0; width: 58px; height: 58px; border-width: 4px; font-size: 16px; }
  .seo-check { grid-template-columns: 24px 1fr; padding: 14px; }
  .seo-next__links { display: grid; }
}
