
/* V14: service/SEO pages. Homepage layout is intentionally untouched. */
.seo-body { background:#f6f8fb; }
.seo-hero { position:relative; isolation:isolate; overflow:hidden; color:#fff; background:#07111f; padding:clamp(78px,9vw,132px) 0 clamp(68px,8vw,112px); }
.seo-hero::before { content:""; position:absolute; inset:0; z-index:-3; background:url("../img/hero/hero-banner-photo.webp") center/cover no-repeat; transform:scale(1.02); }
.seo-hero::after { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(105deg,rgba(4,10,18,.94) 0%,rgba(5,15,28,.86) 48%,rgba(5,15,28,.58) 100%),radial-gradient(circle at 75% 25%,rgba(18,101,232,.28),transparent 35%); }
.seo-hero__grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(280px,.55fr); gap:clamp(34px,6vw,80px); align-items:center; }
.seo-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 18px; color:rgba(255,255,255,.62); font-size:13px; font-weight:700; }
.seo-breadcrumb a:hover { color:#fff; }
.seo-hero h1 { margin:0; max-width:840px; font-size:clamp(40px,5.4vw,72px); line-height:1.03; letter-spacing:-.045em; }
.seo-hero__lead { max-width:780px; margin:24px 0 0; color:rgba(255,255,255,.78); font-size:clamp(17px,1.55vw,20px); line-height:1.75; }
.seo-hero__actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.seo-hero__panel { border:1px solid rgba(255,255,255,.15); background:rgba(7,17,31,.66); backdrop-filter:blur(12px); border-radius:24px; padding:26px; box-shadow:0 26px 70px rgba(0,0,0,.25); }
.seo-hero__panel small { display:block; color:#8eb7ff; font-weight:850; letter-spacing:.1em; text-transform:uppercase; margin-bottom:8px; }
.seo-hero__panel strong { display:block; color:#fff; font-size:22px; line-height:1.2; }
.seo-hero__panel p { margin:12px 0 0; color:rgba(255,255,255,.68); }
.seo-hero__panel a { margin-top:18px; width:100%; }
.seo-main { padding:0 0 92px; }
.seo-intro { padding:clamp(64px,7vw,100px) 0 30px; }
.seo-copy-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.4fr); gap:clamp(36px,6vw,78px); align-items:start; }
.seo-prose h2, .seo-section h2 { margin:0 0 22px; font-size:clamp(30px,3.5vw,48px); line-height:1.12; letter-spacing:-.035em; color:#101828; }
.seo-prose p { margin:0 0 18px; color:#475467; font-size:16px; line-height:1.82; }
.seo-side-card { position:sticky; top:110px; background:#fff; border:1px solid #e6eaf0; border-radius:22px; padding:24px; box-shadow:0 18px 50px rgba(16,24,40,.07); }
.seo-side-card h2 { margin:0 0 14px; font-size:20px; }
.seo-side-card ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.seo-side-card li { display:flex; gap:10px; align-items:flex-start; color:#475467; }
.seo-side-card li::before { content:"✓"; color:#1265e8; font-weight:900; }
.seo-section { padding:56px 0; }
.seo-section--white { background:#fff; border-block:1px solid #e6eaf0; }
.seo-section__head { max-width:820px; margin-bottom:28px; }
.seo-section__head p { margin:0; color:#667085; }
.seo-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.seo-card { background:#fff; border:1px solid #e6eaf0; border-radius:20px; padding:24px; box-shadow:0 12px 34px rgba(16,24,40,.05); }
.seo-section--white .seo-card { background:#f8fafc; }
.seo-card span { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:11px; background:rgba(18,101,232,.10); color:#1265e8; font-weight:900; margin-bottom:16px; }
.seo-card h3 { margin:0 0 9px; font-size:20px; letter-spacing:-.02em; }
.seo-card p { margin:0; color:#667085; }
.seo-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; counter-reset:step; }
.seo-step { position:relative; background:#07111f; color:#fff; border-radius:22px; padding:26px; overflow:hidden; min-height:190px; }
.seo-step::before { counter-increment:step; content:"0" counter(step); display:block; color:#71a7ff; font-size:14px; font-weight:900; letter-spacing:.12em; margin-bottom:28px; }
.seo-step h3 { margin:0 0 10px; font-size:20px; }
.seo-step p { margin:0; color:rgba(255,255,255,.68); }
.seo-faq { display:grid; gap:10px; }
.seo-faq details { background:#fff; border:1px solid #e6eaf0; border-radius:16px; padding:0 20px; }
.seo-faq summary { cursor:pointer; font-weight:820; padding:18px 0; }
.seo-faq p { color:#667085; margin:0; padding:0 0 18px; }
.seo-related { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.seo-related a { display:block; background:#fff; border:1px solid #e6eaf0; border-radius:16px; padding:18px; font-weight:800; box-shadow:0 10px 24px rgba(16,24,40,.04); transition:.2s ease; }
.seo-related a:hover { transform:translateY(-2px); border-color:rgba(18,101,232,.35); color:#1265e8; }
.seo-cta { margin-top:56px; background:linear-gradient(135deg,#0b1728,#07111f); color:#fff; border-radius:28px; padding:clamp(28px,5vw,50px); display:flex; align-items:center; justify-content:space-between; gap:28px; box-shadow:0 30px 80px rgba(7,17,31,.18); }
.seo-cta h2 { margin:0 0 8px; color:#fff; font-size:clamp(28px,3vw,42px); }
.seo-cta p { margin:0; color:rgba(255,255,255,.68); }
.seo-cta__actions { display:flex; gap:10px; flex-wrap:wrap; flex:0 0 auto; }
.service-card__link { display:inline-flex; align-items:center; gap:6px; margin-top:14px; color:#1265e8; font-weight:850; font-size:14px; }
.service-card__link:hover { text-decoration:underline; text-underline-offset:3px; }
.footer-service-links { display:grid; gap:7px; }
.footer-service-links a { color:rgba(255,255,255,.62); }
.footer-service-links a:hover { color:#fff; }
@media (max-width: 900px) {
  .seo-hero__grid,.seo-copy-grid { grid-template-columns:1fr; }
  .seo-side-card { position:static; }
  .seo-card-grid { grid-template-columns:1fr; }
  .seo-steps { grid-template-columns:1fr; }
  .seo-related { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .seo-cta { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 640px) {
  .seo-hero { padding-top:58px; }
  .seo-hero::before { background-image:url("../img/hero/hero-banner-photo-mobile.webp"); }
  .seo-hero h1 { font-size:clamp(38px,12vw,54px); }
  .seo-hero__panel { padding:20px; }
  .seo-related { grid-template-columns:1fr; }
  .seo-hero__actions,.seo-cta__actions { display:grid; width:100%; }
  .seo-hero__actions .btn,.seo-cta__actions .btn { width:100%; }
}
