/* frontend-src/styles/seo/10-public-pages.css */
:root {
  --seo-ink: #eaf5f1;
  --seo-muted: #9ab2ac;
  --seo-line: rgba(159, 221, 204, .16);
  --seo-accent: #75e5bf;
  --seo-bg: #07100f;
}

.seo-page { min-height: 100vh; color: var(--seo-ink); background: radial-gradient(circle at 80% 0%, #15372e 0, transparent 38rem), var(--seo-bg); font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; }
.seo-nav { display:flex; align-items:center; justify-content:space-between; max-width:1160px; margin:auto; padding:24px 28px; }
.seo-brand { color:var(--seo-ink); font-weight:700; letter-spacing:.14em; text-decoration:none; }
.seo-brand small { color:var(--seo-accent); font-size:10px; margin-left:10px; letter-spacing:.2em; }
.seo-nav-links { display:flex; gap:20px; flex-wrap:wrap; justify-content:flex-end; }
.seo-nav-links a, .seo-cta { color:var(--seo-ink); text-decoration:none; font-size:13px; }
.seo-nav-links a:hover { color:var(--seo-accent); }
.seo-wrap { max-width:1100px; margin:auto; padding:48px 28px 88px; }
.seo-kicker { color:var(--seo-accent); font-size:12px; letter-spacing:.2em; text-transform:uppercase; }
.seo-hero { display:grid; grid-template-columns:1.08fr .92fr; gap:56px; align-items:center; padding:56px 0 72px; }
.seo-hero h1 { max-width:680px; margin:14px 0 20px; font-size:clamp(36px, 5vw, 66px); line-height:1.08; letter-spacing:-.045em; }
.seo-lead { max-width:650px; color:var(--seo-muted); font-size:18px; line-height:1.8; }
.seo-cta { display:inline-flex; align-items:center; gap:8px; margin-top:26px; padding:13px 19px; border:1px solid var(--seo-accent); border-radius:999px; color:#07100f; background:var(--seo-accent); font-weight:700; }
.seo-visual { overflow:hidden; border:1px solid var(--seo-line); border-radius:24px; background:linear-gradient(145deg, rgba(117,229,191,.18), rgba(16,25,30,.82)); box-shadow:0 30px 80px rgba(0,0,0,.3); }
.seo-visual img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; }
.seo-visual figcaption { padding:14px 18px; color:var(--seo-muted); font-size:12px; }
.seo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:18px 0 70px; }
.seo-card, .seo-section { border:1px solid var(--seo-line); border-radius:18px; background:rgba(11,25,22,.72); }
.seo-card { padding:24px; }
.seo-card strong { display:block; margin-bottom:9px; font-size:17px; }
.seo-card p, .seo-section p, .seo-section li { color:var(--seo-muted); line-height:1.75; }
.seo-section { padding:32px; margin-top:18px; }
.seo-section h2 { margin:0 0 14px; font-size:28px; letter-spacing:-.02em; }
.seo-section ul { padding-left:20px; }
.seo-breadcrumb { color:var(--seo-muted); font-size:13px; }
.seo-breadcrumb a { color:var(--seo-accent); text-decoration:none; }
.seo-footer { max-width:1100px; margin:auto; padding:28px; color:var(--seo-muted); border-top:1px solid var(--seo-line); font-size:12px; }
@media (max-width: 760px) { .seo-nav { align-items:flex-start; gap:18px; flex-direction:column; } .seo-hero { grid-template-columns:1fr; padding-top:34px; } .seo-grid { grid-template-columns:1fr; margin-bottom:42px; } .seo-wrap { padding-inline:20px; } .seo-section { padding:24px; } }
