.seo-hero { padding: 68px 0; color: #fff; background: linear-gradient(125deg, #071a32 0%, #123f70 70%, #17548e 100%); }
.seo-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; color: #c8d8e7; font-size: .82rem; }
.seo-breadcrumb a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.seo-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); align-items: center; gap: 56px; }
.seo-hero h1 { max-width: 780px; margin: 8px 0 16px; font-size: clamp(2.2rem, 5vw, 4.5rem); line-height: 1.02; letter-spacing: -.055em; }
.seo-hero p { max-width: 700px; margin: 0; color: #dce9f4; font-size: 1.08rem; line-height: 1.7; }
.seo-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.seo-hero__visual { height: 360px; padding: 26px; overflow: hidden; border: 1px solid rgba(255,255,255,.24); border-radius: 18px; background: #fff; box-shadow: 0 26px 60px rgba(0,0,0,.24); }
.seo-hero__visual img { width: 100%; height: 100%; object-fit: contain; }
.seo-hero__visual--store { padding: 0; }
.seo-hero__visual--store img { object-fit: cover; transform: scale(1.25); transform-origin: 78% 72%; }
.seo-section { padding: 64px 0; background: #f5f7fa; }
.seo-content-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr); align-items: start; gap: 42px; }
.seo-article { padding: 36px; border: 1px solid #dce3ea; border-radius: 16px; background: #fff; box-shadow: 0 12px 30px rgba(10,35,60,.06); }
.seo-article h2 { margin: 0 0 12px; color: #102a4d; font-size: clamp(1.45rem, 2.6vw, 2.15rem); }
.seo-article h2:not(:first-child) { margin-top: 34px; }
.seo-article p, .seo-article li { color: #4c6073; font-size: 1rem; line-height: 1.75; }
.seo-article ul { padding-left: 22px; }
.seo-side { position: sticky; top: 92px; padding: 28px; border-radius: 16px; color: #fff; background: #102a4d; }
.seo-side h2 { margin: 0 0 10px; font-size: 1.35rem; }
.seo-side p { margin: 0 0 20px; color: #d6e3ee; line-height: 1.65; }
.seo-side .button { width: 100%; margin-top: 10px; }
.seo-related { padding: 60px 0; background: #fff; }
.seo-related h2, .seo-faq h2 { margin: 0 0 24px; color: #102a4d; font-size: clamp(1.55rem, 3vw, 2.35rem); }
.seo-links-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.seo-link-card { min-height: 138px; padding: 22px; border: 1px solid #dbe3eb; border-radius: 13px; background: #f8fafc; transition: border-color .2s ease, box-shadow .2s ease; }
.seo-link-card:hover { border-color: #7ea4c8; box-shadow: 0 12px 24px rgba(13,46,77,.09); }
.seo-link-card strong { display: block; color: #102a4d; font-size: 1.02rem; }
.seo-link-card span { display: block; margin-top: 8px; color: #617386; font-size: .9rem; line-height: 1.55; }
.seo-faq { padding: 60px 0 72px; background: #f5f7fa; }
.seo-faq details { margin-bottom: 10px; padding: 18px 20px; border: 1px solid #dbe3eb; border-radius: 12px; background: #fff; }
.seo-faq summary { cursor: pointer; color: #173b60; font-weight: 850; }
.seo-faq details p { margin: 12px 0 0; color: #53677a; line-height: 1.7; }
.footer__grid--seo { grid-template-columns: 1.2fr .8fr 1fr; }
@media (max-width: 900px) {
  .seo-hero__grid, .seo-content-grid { grid-template-columns: 1fr; }
  .seo-hero__visual { height: 300px; }
  .seo-side { position: static; }
  .seo-links-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer__grid--seo { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .seo-hero { padding: 44px 0; }
  .seo-hero__visual { height: 250px; }
  .seo-hero__actions { flex-direction: column; }
  .seo-article { padding: 24px 20px; }
  .seo-links-grid, .footer__grid--seo { grid-template-columns: 1fr; }
}