:root {
  color-scheme: light;
  --navy: #0b1020;
  --navy-2: #111a2e;
  --navy-3: #1a2943;
  --ink: #15213a;
  --muted: #61708a;
  --muted-dark: #9ba8bb;
  --line: #e3e9f0;
  --surface: #ffffff;
  --surface-2: #f4f7fa;
  --teal: #00d4b2;
  --teal-dark: #007f71;
  --blue: #4078ee;
  --amber: #f3b34d;
  --red: #bf404d;
  --radius: 16px;
  --shadow: 0 20px 55px rgba(21, 38, 66, .09);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--surface); font-size: 16px; line-height: 1.6; }
h1, h2, h3, h4, h5, h6 { text-transform: capitalize; }
button, input, textarea, select { font: inherit; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--teal-dark); }
button { cursor: pointer; }
img { max-width: 100%; }
::selection { color: var(--navy); background: rgba(0, 212, 178, .3); }
.wrap { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 20; left: 16px; top: -60px; background: var(--teal); color: var(--navy); padding: 10px 16px; border-radius: 6px; font-weight: 700; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 3px solid #127fe5; outline-offset: 3px; border-radius: 4px; }
.site-header { height: 82px; position: relative; z-index: 5; background: rgba(255,255,255,.96); border-bottom: 1px solid rgba(225,233,242,.8); }
.nav-wrap { width: min(1240px, calc(100% - 48px)); height: 100%; margin: auto; display: flex; justify-content: space-between; align-items: center; }
.brand { display: inline-flex; gap: 11px; align-items: center; color: var(--navy); }
.brand img { display: block; flex: 0 0 auto; }
.brand span { display: grid; line-height: 1.1; }
.brand strong { font-size: 20px; letter-spacing: -.055em; font-weight: 780; }
.brand small { font-size: 10px; color: var(--muted); letter-spacing: .095em; text-transform: uppercase; margin-top: 5px; }
.primary-nav { display: flex; align-items: center; gap: 29px; font-size: 13px; font-weight: 600; color: #51617b; }
.primary-nav > a:not(.button) { padding: 8px 0; transition: color .18s ease; }
.primary-nav > a:hover, .primary-nav > a.active { color: var(--navy); }
.primary-nav .button { color: var(--navy); }
.nav-logout { display: inline; }
.nav-button { padding: 8px 0; border: 0; background: none; color: #51617b; font-weight: 600; font-size: 13px; }
.nav-button:hover { color: var(--navy); }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 10px; border: 1px solid var(--line); background: white; border-radius: 9px; }
.menu-toggle span:not(.sr-only) { display: block; height: 2px; margin: 4px 0; background: var(--navy); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 0 21px; border: 1px solid var(--teal); border-radius: 8px; color: var(--navy); background: var(--teal); font-size: 14px; font-weight: 750; letter-spacing: -.01em; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.button:hover { color: var(--navy); background: #36e4c8; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0,212,178,.2); }
.button-small { min-height: 40px; padding: 0 15px; font-size: 12px; }
.button-outline { background: white; color: var(--navy); border-color: #cdd7e4; }
.button-outline:hover { background: #f3f7fa; border-color: #aab9cb; }
.button-ghost { border-color: rgba(255,255,255,.32); color: white; background: transparent; }
.button-ghost:hover { background: rgba(255,255,255,.08); color: white; }
.flash { position: fixed; z-index: 9; right: 24px; top: 96px; max-width: 440px; padding: 14px 18px; border-radius: 9px; box-shadow: var(--shadow); background: white; border: 1px solid var(--line); font-size: 14px; }
.flash-error { border-left: 4px solid var(--red); }
.flash-info { border-left: 4px solid var(--blue); }

.hero { min-height: 590px; padding-top: 77px; padding-bottom: 76px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 38px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 17px; color: #008b7c; font-size: 11px; font-weight: 800; letter-spacing: .14em; line-height: 1.4; text-transform: uppercase; }
.eyebrow a { color: inherit; }
.hero h1 { max-width: 650px; margin: 0; color: var(--navy); font-size: clamp(43px, 5vw, 66px); line-height: 1.03; letter-spacing: -.065em; font-weight: 760; }
.hero h1 span { color: #00a890; }
.hero-lede { max-width: 540px; margin: 25px 0 25px; color: #596983; font-size: 17px; line-height: 1.75; }
.hero-audit { display: flex; gap: 9px; width: min(570px, 100%); padding: 6px; border: 1px solid #dbe3ed; border-radius: 11px; box-shadow: 0 12px 32px rgba(16,35,67,.07); background: white; }
.hero-audit input { width: 100%; min-width: 0; padding: 0 15px; color: var(--ink); border: 0; outline: 0; background: transparent; }
.hero-audit input:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }
.hero-audit .button { flex: 0 0 auto; }
.hero-links { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 18px; color: #697992; font-size: 12px; }
.hero-links a { color: var(--navy); font-weight: 750; }
.status-dot { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(0,212,178,.12); }
.hero-visual { position: relative; min-height: 440px; display: flex; align-items: center; justify-content: center; }
.hero-visual::before { content: ""; position: absolute; width: 415px; height: 415px; border-radius: 50%; background: radial-gradient(circle, rgba(0,212,178,.16), rgba(62,120,238,.06) 52%, transparent 72%); }
.visual-orbit { position: absolute; border: 1px solid rgba(18,115,145,.13); border-radius: 50%; }
.orbit-one { width: 390px; height: 240px; transform: rotate(-29deg); }
.orbit-two { width: 430px; height: 280px; transform: rotate(33deg); }
.report-card { position: relative; z-index: 1; width: 360px; padding: 22px; border: 1px solid rgba(210,224,235,.9); border-radius: 16px; background: #fff; box-shadow: 0 28px 75px rgba(20,42,75,.18); transform: rotate(-2deg); }
.report-head,.report-domain,.score-row,.report-line,.report-foot { display: flex; align-items: center; justify-content: space-between; }
.report-kicker { color: #72819a; font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.report-status { display: flex; align-items: center; gap: 6px; color: #68778d; font-size: 9px; }
.report-status i { width: 6px; height: 6px; border-radius: 50%; background: #e6a849; }
.report-domain { justify-content: flex-start; gap: 11px; margin-top: 23px; padding-bottom: 19px; border-bottom: 1px solid var(--line); }
.domain-symbol { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #e6fbf7; color: #008b7c; font-weight: 800; }
.report-domain div { display: grid; gap: 3px; }
.report-domain strong { font-size: 12px; }
.report-domain small { color: var(--muted); font-size: 9px; }
.score-row { justify-content: flex-start; gap: 16px; padding: 19px 0 15px; }
.score-ring { width: 67px; height: 67px; display: flex; align-items: baseline; justify-content: center; padding-top: 20px; border-radius: 50%; border: 5px solid #00c8a5; box-shadow: inset 0 0 0 4px #e5f9f5; }
.score-ring strong { font-size: 20px; line-height: 1; }
.score-ring small { color: #748198; font-size: 8px; }
.score-row > div:last-child strong { font-size: 13px; }
.score-row p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.report-line { padding: 11px 0; border-top: 1px solid #edf1f5; font-size: 10px; }
.report-line span { display: flex; align-items: center; gap: 8px; }
.report-line b { color: #697991; font-size: 9px; font-weight: 650; }
.check-mark,.warning-mark { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: #e8faf5; color: #008c77; font-size: 10px; font-style: normal; }
.warning-mark { background: #fff4dc; color: #b47a19; }
.report-foot { justify-content: center; padding-top: 12px; color: #8995a7; font-size: 8px; border-top: 1px solid #edf1f5; }
.floating-chip { position: absolute; z-index: 2; display: flex; align-items: center; gap: 9px; padding: 11px 14px; border: 1px solid #e1e8ef; border-radius: 11px; background: white; box-shadow: 0 12px 28px rgba(22,42,73,.1); animation: float 5s ease-in-out infinite; }
.floating-chip span:last-child { display: grid; line-height: 1.3; }
.floating-chip small { color: #77849a; font-size: 8px; }
.floating-chip strong { color: var(--navy); font-size: 10px; }
.chip-left { left: -6px; top: 105px; }
.chip-right { right: -10px; bottom: 75px; animation-delay: -2.5s; }
.chip-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: #eff5ff; color: #4878d9; font-size: 16px; }
.chip-teal { background: #e8fbf6; color: #008e7a; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.trust-strip { background: #f3f7f9; border-block: 1px solid #e9eff3; }
.trust-inner { min-height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 18px; color: #65748c; font-size: 11px; font-weight: 650; }

.section { padding-block: 91px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 31px; }
.section-heading .eyebrow { margin-bottom: 12px; }
.section h2,.section-heading h2 { margin: 0; color: var(--navy); font-size: clamp(30px, 3.5vw, 43px); line-height: 1.14; letter-spacing: -.055em; }
.text-link { display: inline-flex; gap: 10px; align-items: center; color: var(--navy); font-size: 13px; font-weight: 760; }
.text-link span,.tool-link span { color: #008d7b; transition: transform .18s ease; }
.text-link:hover span,.tool-link:hover span { transform: translateX(4px); }
.tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.tool-card { position: relative; display: flex; min-height: 222px; flex-direction: column; padding: 22px; border: 1px solid var(--line); border-radius: 13px; background: #fff; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.tool-card:hover { color: inherit; border-color: #a4e8dc; box-shadow: 0 16px 35px rgba(24,52,79,.08); transform: translateY(-4px); }
.tool-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 17px; }
.tool-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; color: #008d7b; background: #e9faf6; font-size: 19px; font-weight: 700; }
.card-arrow { color: #8593a7; font-size: 14px; }
.card-category { margin: 0 0 6px; color: #028b7b; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.tool-card h3 { margin: 0 0 7px; color: var(--navy); font-size: 17px; line-height: 1.3; letter-spacing: -.025em; }
.tool-card p { margin: 0; color: #697890; font-size: 12px; line-height: 1.65; }
.tool-link { display: inline-flex; gap: 8px; align-items: center; margin-top: auto; padding-top: 17px; color: var(--navy); font-size: 11px; font-weight: 750; }
.section-dark { color: #fff; background: var(--navy); }
.section-dark h2,.section-dark h3 { color: #fff; }
.section-dark .eyebrow { color: var(--teal); }
.muted-copy { max-width: 380px; margin: 18px 0 25px; color: #abb8c9; font-size: 14px; }
.how-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 100px; align-items: start; }
.steps { margin: 0; padding: 0; list-style: none; }
.steps li { display: grid; grid-template-columns: 45px 1fr; gap: 17px; padding: 19px 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.steps li:first-child { padding-top: 0; }
.steps li > span { color: var(--teal); font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.steps h3 { margin: 0 0 5px; font-size: 16px; }
.steps p { margin: 0; color: #abb8c9; font-size: 12px; line-height: 1.6; }
.split-feature { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 75px; }
.split-feature p:not(.eyebrow) { color: #64738a; font-size: 14px; }
.feature-art { min-height: 360px; display: grid; place-items: center; overflow: hidden; border-radius: 22px; background: #eef5f5; }
.feature-art img { display: block; width: 100%; }
.feature-list { padding: 0; margin: 21px 0 25px; list-style: none; color: #34435b; font-size: 13px; }
.feature-list li { padding: 9px 0 9px 26px; position: relative; border-bottom: 1px solid #edf1f4; }
.feature-list li::before { content: "✓"; position: absolute; left: 0; color: #009986; font-weight: 800; }
.section-tint { background: #f4f8f9; }
.category-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
.category-pill { display: flex; min-height: 64px; align-items: center; gap: 14px; padding: 0 17px; border: 1px solid #e1e8ec; border-radius: 10px; background: white; font-size: 13px; font-weight: 700; transition: border-color .18s ease, transform .18s ease; }
.category-pill:hover { border-color: #8edfd1; color: var(--navy); transform: translateX(3px); }
.category-number { color: #008b7a; font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.category-arrow { margin-left: auto; color: #8b99aa; }
.benefit-row { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; align-items: start; gap: 30px; }
.benefit-row h2 { margin: 0; font-size: 30px; line-height: 1.2; letter-spacing: -.05em; }
.benefit { display: flex; gap: 13px; padding-top: 7px; }
.benefit-number { color: #009987; font-size: 10px; font-weight: 800; }
.benefit h3 { margin: 0 0 5px; font-size: 14px; }
.benefit p { margin: 0; color: #738198; font-size: 11px; line-height: 1.6; }
.cta-band { display: flex; justify-content: space-between; align-items: center; gap: 50px; }
.cta-band h2 { margin: 0; }
.cta-band > div:last-child { max-width: 385px; }
.cta-band > div:last-child p { color: #aab6c8; font-size: 13px; margin: 0 0 18px; }
.cta-register { display: inline-flex; margin-left: 14px; color: #e8f0f9; font-size: 12px; font-weight: 700; }
.cta-register:hover { color: var(--teal); }
.pricing-preview { display: grid; grid-template-columns: .8fr 1.2fr; gap: 65px; align-items: center; }
.pricing-preview > div:first-child > p:not(.eyebrow) { max-width: 400px; color: #69788e; font-size: 13px; }
.pricing-preview h2 { margin: 0; color: var(--navy); font-size: clamp(29px,3.5vw,42px); line-height: 1.15; letter-spacing: -.055em; }
.pricing-preview .text-link { margin-top: 8px; }
.plan-preview { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.plan-preview > div { padding: 21px; border: 1px solid #dfe7ec; border-radius: 12px; background: #fff; }
.plan-label { display: block; margin-bottom: 14px; color: #008d7b; font-size: 9px; font-weight: 850; letter-spacing: .12em; }
.plan-preview strong { display: block; color: var(--navy); font-size: 19px; letter-spacing: -.03em; }
.plan-preview p { min-height: 55px; color: #718096; font-size: 11px; line-height: 1.55; }
.plan-preview ul { margin: 0; padding: 0; list-style: none; color: #4f5e74; font-size: 10px; }
.plan-preview li { padding: 6px 0; border-top: 1px solid #edf1f4; }
.faq-preview { display: grid; grid-template-columns: .7fr 1.3fr; gap: 85px; align-items: start; }
.faq-preview h2 { margin: 0 0 18px; color: var(--navy); font-size: 35px; line-height: 1.15; letter-spacing: -.05em; }
.faq-preview .text-link { margin-top: 3px; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { position: relative; padding: 17px 35px 17px 0; color: var(--navy); font-size: 13px; font-weight: 750; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 4px; top: 12px; color: #008d7b; font-size: 20px; font-weight: 500; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 620px; margin: 0; padding: 0 28px 17px 0; color: #69788e; font-size: 12px; line-height: 1.7; }
.home-blog-grid { padding-top: 0; padding-bottom: 0; }

.site-footer { padding-top: 54px; background: #f6f8fa; border-top: 1px solid #e5ebf0; }
.footer-top { display: grid; grid-template-columns: 1.45fr repeat(3, 1fr); gap: 45px; padding-bottom: 41px; }
.footer-brand p { max-width: 265px; margin: 17px 0; color: #6d7b90; font-size: 12px; }
.brand-footer strong { font-size: 18px; }
.brand-footer small { font-size: 9px; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.footer-column h2 { margin: 0 0 8px; color: var(--navy); font-size: 12px; }
.footer-column a { color: #697890; font-size: 11px; }
.footer-column a:hover { color: var(--teal-dark); }
.footer-bottom { display: flex; justify-content: space-between; gap: 16px; padding-block: 17px; border-top: 1px solid #e2e8ee; color: #7c899c; font-size: 10px; }
.footer-bottom a { color: #43536b; text-decoration: underline; text-underline-offset: 2px; }

.page-hero { padding-top: 76px; padding-bottom: 42px; }
.page-hero h1 { margin: 0; max-width: 800px; color: var(--navy); font-size: clamp(38px, 5vw, 58px); line-height: 1.06; letter-spacing: -.06em; }
.lede { max-width: 720px; margin: 19px 0 0; color: #65738a; font-size: 16px; line-height: 1.7; }
.tool-search,.blog-search { display: flex; flex-direction: column; gap: 6px; max-width: 430px; margin-top: 27px; }
.tool-search label,.blog-search label { color: #4c5b72; font-size: 11px; font-weight: 750; }
.tool-search input,.blog-search input { height: 46px; padding: 0 13px; border: 1px solid #d6dfe8; border-radius: 8px; background: #fff; }
.directory { padding-bottom: 80px; }
.directory-group { padding: 20px 0 42px; scroll-margin-top: 30px; }
.directory-heading { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 17px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.directory-heading h2 { margin: 0; color: var(--navy); font-size: 21px; letter-spacing: -.035em; }
.directory-heading span { color: #7b889b; font-size: 11px; }
.tool-grid-compact { grid-template-columns: repeat(3, 1fr); }
.tool-grid-compact .tool-card { min-height: 200px; }
.tool-hero { padding-bottom: 27px; }
.tool-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.meta-badge { display: inline-flex; padding: 5px 9px; border: 1px solid #dce5eb; border-radius: 50px; color: #65738a; background: white; font-size: 10px; font-weight: 700; }
.tool-workspace { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(245px, .7fr); gap: 22px; padding-bottom: 80px; align-items: start; }
.tool-panel,.aside-card,.content-card { padding: 24px; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: 0 7px 22px rgba(24,44,70,.035); }
.content-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.content-card-heading h2 { margin-right: auto; }
.article-editor { max-width: 920px; margin: 0 auto 90px; }
.button-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.panel-title { display: flex; align-items: center; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid #edf1f4; }
.panel-title h2 { margin: 0; color: var(--navy); font-size: 18px; }
.panel-title p { margin: 3px 0 0; color: #7a8799; font-size: 11px; }
.tool-form,.stack-form { display: flex; flex-direction: column; gap: 9px; padding-top: 17px; }
.tool-form label,.stack-form label { margin-top: 7px; color: #394961; font-size: 12px; font-weight: 700; }
.tool-form input,.tool-form textarea,.tool-form select,.stack-form input,.stack-form textarea,.stack-form select { width: 100%; padding: 11px 12px; border: 1px solid #d8e0e8; border-radius: 7px; background: #fff; color: #17243c; font-size: 13px; }
.tool-form input,.stack-form input,.tool-form select,.stack-form select { min-height: 44px; }
.tool-form textarea,.stack-form textarea { resize: vertical; min-height: 104px; line-height: 1.55; }
.tool-form .button,.stack-form .button { align-self: flex-start; margin-top: 9px; }
.optional,.stack-form small { color: #8490a0; font-size: 10px; font-weight: 450; }
.tool-aside { display: grid; gap: 14px; }
.aside-card h2 { margin: 0 0 10px; color: var(--navy); font-size: 17px; }
.aside-card h3 { margin: 19px 0 7px; color: var(--navy); font-size: 12px; }
.aside-card p { color: #69778c; font-size: 11px; line-height: 1.7; }
.aside-card .text-link { margin-top: 5px; font-size: 11px; }
.safety-card { background: #f3faf8; border-color: #deeee9; }
.safety-card h3 { margin-top: 10px; }
.safety-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: #087c6c; background: #d8f7ef; font-size: 13px; }
.result-block { margin-top: 25px; padding-top: 21px; border-top: 1px solid var(--line); }
.result-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.result-heading h2 { margin: 0; color: var(--navy); font-size: 18px; }
.result-heading .eyebrow { margin-bottom: 5px; }
.result-heading .button { min-height: 36px; font-size: 11px; }
.result-output { max-height: 520px; overflow: auto; padding: 17px; border: 1px solid #e3e9ef; border-radius: 8px; color: #dce8f6; background: #111a2e; font-size: 11px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.result-note { color: #8390a2; font-size: 10px; line-height: 1.6; }
.result-message { margin-top: 17px; padding: 13px 15px; border-radius: 8px; font-size: 12px; }
.result-message p { margin: 5px 0 0; }
.result-message.error { border: 1px solid #f0d1d5; color: #83323d; background: #fff5f6; }
.tool-limit-status { margin: 14px 0 0; padding: 10px 12px; border: 1px solid #c9e9e2; border-radius: 8px; color: #28645b; background: #f0fbf8; font-size: 12px; }
.tool-fields { min-width: 0; margin: 0; padding: 0; border: 0; }
.tool-fields:disabled { opacity: .65; }
.registration-required { margin-top: 14px; padding: 15px; border: 1px solid #f0dbac; border-radius: 9px; background: #fffaf0; }
.registration-required p { margin: 5px 0 12px; color: #65738a; font-size: 13px; }
.registration-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.registration-modal { width: min(480px, calc(100% - 32px)); padding: 28px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: #fff; box-shadow: 0 24px 80px rgba(8, 23, 42, .26); }
.registration-modal::backdrop { background: rgba(12, 26, 44, .58); backdrop-filter: blur(3px); }
.registration-modal h2 { margin: 0 0 10px; color: var(--navy); font-size: 24px; }
.registration-modal > p:not(.eyebrow) { margin: 0 0 20px; color: #65738a; font-size: 14px; line-height: 1.6; }
.registration-modal form { margin-top: 20px; }
.registration-modal .modal-dismiss { padding: 0; border: 0; background: none; cursor: pointer; }
.cookie-notice { position: fixed; z-index: 30; right: 20px; bottom: 20px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; width: min(490px, calc(100% - 40px)); padding: 17px; border: 1px solid #dce5eb; border-radius: 12px; background: #fff; box-shadow: 0 16px 48px rgba(17, 32, 55, .18); }
.cookie-notice[hidden] { display: none; }
.cookie-notice strong { color: var(--navy); font-size: 13px; }
.cookie-notice p { margin: 4px 0 5px; color: #65738a; font-size: 12px; line-height: 1.5; }
.cookie-notice a { color: #007f73; font-size: 12px; font-weight: 700; }
.about-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr); align-items: center; gap: 42px; padding-block: 58px 38px; }
.about-hero .eyebrow { margin-bottom: 18px; }
.about-hero h1 { margin: 0 0 14px; font-size: clamp(44px, 6vw, 68px); line-height: 1.02; letter-spacing: -.055em; }
.about-hero .lede { margin: 0; }
.about-hero-image { margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #eef6f5; box-shadow: 0 16px 42px rgba(17,32,55,.09); }
.about-hero-image img { display: block; width: 100%; height: auto; }
.about-hero-image figcaption { padding: 12px 16px; color: var(--muted); font-size: 12px; }
.about-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; align-items: start; gap: 50px; padding-bottom: 90px; }
.about-layout-wide { grid-template-columns: minmax(0, 860px); justify-content: center; }
.about-copy { max-width: 790px; color: #536178; font-size: 15px; line-height: 1.82; }
.about-copy section + section { margin-top: 42px; }
.about-copy h2 { margin: 0 0 14px; color: var(--navy); font-size: 26px; line-height: 1.2; }
.about-copy p { margin: 0 0 16px; }
.about-copy ul { margin: 0 0 16px; padding-left: 22px; }
.about-copy li { margin: 0 0 10px; }
.about-aside { position: sticky; top: 100px; align-self: start; padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: #f7fbfb; }
.about-aside h2 { margin: 7px 0 12px; color: var(--navy); font-size: 21px; }
.about-aside p:not(.eyebrow) { margin: 0 0 18px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.about-aside .text-link { display: block; margin-top: 15px; }
.content-page { display: grid; grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 50px; padding-bottom: 90px; }
.content-copy { max-width: 730px; min-height: 250px; color: #536178; font-size: 15px; line-height: 1.8; }
.content-copy h2,.content-copy h3 { color: var(--navy); }
.content-aside { padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: #f7fafb; }
.content-aside h2 { margin: 0; color: var(--navy); font-size: 19px; letter-spacing: -.03em; }
.content-aside p:not(.eyebrow) { color: #6b7990; font-size: 12px; }
.content-aside .button { min-height: 40px; font-size: 12px; }
.error-page,.message-page { padding-block: 90px 110px; text-align: center; }
.error-page .eyebrow,.message-page .eyebrow { justify-content: center; }
.error-code { color: #dce7ea; font-size: clamp(60px,12vw,130px); font-weight: 850; letter-spacing: -.09em; line-height: 1; }
.error-page h1,.message-page h1 { margin: 15px 0 0; color: var(--navy); font-size: clamp(35px,5vw,53px); line-height: 1.08; letter-spacing: -.06em; }
.error-page .lede,.message-page .lede { margin: 14px auto 25px; }
.error-actions { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.success-icon { width: 48px; height: 48px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 50%; background: #e1f9f2; color: #008c78; font-size: 20px; }

.auth-layout { display: grid; grid-template-columns: 1fr 430px; gap: 75px; align-items: center; padding-block: 72px 90px; }
.auth-copy { padding-left: 20px; }
.auth-copy h1 { max-width: 540px; margin: 0; color: var(--navy); font-size: clamp(42px,5vw,62px); line-height: 1.03; letter-spacing: -.065em; }
.auth-copy > p:not(.eyebrow) { max-width: 450px; color: #68778e; font-size: 15px; }
.auth-points { display: flex; flex-direction: column; gap: 9px; margin-top: 25px; color: #4e5d73; font-size: 12px; }
.auth-points span::first-letter { color: #009987; }
.auth-card { padding: 30px; border: 1px solid #e1e8ef; border-radius: 15px; background: white; box-shadow: var(--shadow); }
.auth-card h2 { margin: 0; color: var(--navy); font-size: 24px; letter-spacing: -.04em; }
.auth-card > p { color: #718098; font-size: 12px; }
.error-card { border-top: 3px solid #c9685e; }
.error-card h2 { max-width: 290px; }
.error-card .error-actions { justify-content: flex-start; margin-top: 22px; }
.error-symbol { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 20px; border: 1px solid #f0d4d0; border-radius: 14px; background: #fff5f3; color: #ae4e45; font-size: 26px; font-weight: 800; }
.error-layout .auth-points span::first-letter { color: #b35d54; }
.auth-switch { margin: 15px 0 0; color: #738198; font-size: 11px; }
.auth-switch a { color: #087e71; font-weight: 700; }
.checkbox-label { display: flex; align-items: flex-start; gap: 9px; margin-block: 9px; font-size: 11px !important; line-height: 1.5; }
.checkbox-label input { width: 15px; min-height: 15px; margin-top: 2px; accent-color: #009987; }
.checkbox-label a { color: #087e71; text-decoration: underline; }

.account-layout { display: grid; grid-template-columns: 190px 1fr; gap: 22px; padding-bottom: 90px; align-items: start; }
.account-nav { display: flex; flex-direction: column; padding: 8px; border: 1px solid var(--line); border-radius: 10px; }
.account-nav a { padding: 10px; color: #65738a; font-size: 12px; border-radius: 6px; }
.account-nav a:hover { color: var(--navy); background: #f3f7f8; }
.account-main { display: grid; gap: 16px; }
.content-card h2 { margin: 0 0 13px; color: var(--navy); font-size: 18px; }
.content-card h3 { margin: 0 0 10px; color: var(--navy); font-size: 14px; }
.content-card p { color: #65738a; font-size: 12px; }
.inline-form { display: flex; flex-wrap: wrap; gap: 8px; }
.inline-form input { flex: 1 1 170px; min-height: 43px; padding: 0 11px; border: 1px solid #d8e0e8; border-radius: 7px; }
.inline-form .button { min-height: 43px; font-size: 12px; }
.empty-state { color: #8290a2; font-size: 12px; }
.data-list { display: flex; flex-direction: column; }
.data-row { display: flex; justify-content: space-between; align-items: center; gap: 15px; min-height: 52px; padding-block: 10px; border-bottom: 1px solid #edf1f4; color: #48566d; font-size: 11px; }
.data-row:last-child { border-bottom: 0; }
.data-row > div { display: grid; gap: 3px; }
.data-row strong { color: var(--navy); font-size: 12px; }
.data-row small,.data-row time { color: #8290a2; font-size: 10px; }
.account-shortcuts { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 20px; font-size: 12px; font-weight: 700; color: #008878; }

.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; padding-top: 12px; padding-bottom: 90px; }
.blog-card { overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: white; transition: transform .18s ease, box-shadow .18s ease; }
.blog-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(30,50,80,.09); }
.blog-image { display: block; aspect-ratio: 1.75; overflow: hidden; background: #eff5f5; }
.blog-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.blog-card-body { padding: 18px; }
.blog-card-body h2 { margin: 0 0 8px; color: var(--navy); font-size: 17px; line-height: 1.3; letter-spacing: -.03em; }
.blog-card-body h2 a:hover { color: #007f71; }
.blog-card-body p:not(.card-category) { margin: 0; color: #69778c; font-size: 11px; line-height: 1.65; }
.blog-card-body .tool-link { padding-top: 13px; }
.blog-search { margin-top: 21px; }
.article-page { max-width: 900px; padding-top: 32px; padding-bottom: 90px; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 9px; color: #7d8a9c; font-size: 10px; }
.breadcrumbs a { color: #506079; }
.article-header { max-width: 760px; margin: 41px auto 25px; text-align: center; }
.article-header .eyebrow { justify-content: center; }
.article-header h1 { margin: 0; color: var(--navy); font-size: clamp(39px,6vw,60px); line-height: 1.08; letter-spacing: -.06em; }
.article-header .lede { margin-inline: auto; }
.article-meta { display: flex; justify-content: center; gap: 18px; margin-top: 18px; color: #7b8799; font-size: 10px; }
.article-cover { max-width: 850px; margin: 0 auto 38px; border-radius: 15px; overflow: hidden; background: #eef4f5; }
.article-cover img { display: block; width: 100%; max-height: 420px; object-fit: cover; }
.article-content { max-width: 730px; margin-inline: auto; color: #45536a; font-size: 15px; line-height: 1.85; }
.article-content h2 { margin: 39px 0 12px; color: var(--navy); font-size: 27px; line-height: 1.2; letter-spacing: -.04em; }
.article-content h3 { margin: 27px 0 9px; color: var(--navy); font-size: 19px; }
.article-content p { margin: 14px 0; }
.article-content ul,.article-content ol { padding-left: 23px; }
.article-content li { margin: 7px 0; }
.article-content a { color: #087c70; text-decoration: underline; text-underline-offset: 3px; }
.article-content blockquote { margin: 25px 0; padding: 12px 19px; border-left: 3px solid var(--teal); background: #f2f9f7; color: #4f6374; }
.article-footer { display: flex; justify-content: center; gap: 10px; margin-top: 45px; flex-wrap: wrap; }

.admin-top { padding: 41px 0 28px; background: var(--navy); }
.admin-top h1 { margin: 0; color: #fff; font-size: 38px; letter-spacing: -.05em; }
.admin-top .eyebrow { margin-bottom: 7px; }
.admin-title-row { display: flex; justify-content: space-between; align-items: center; }
.admin-title-row .muted-copy { margin: 5px 0 0; font-size: 12px; }
.admin-mode-actions { display: flex; align-items: center; gap: 12px; }
.admin-mode-actions form { margin: 0; }
.account-mode-switch { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.account-mode-switch p { margin-bottom: 0; }
.google-captcha { display: flex; justify-content: flex-start; min-height: 78px; align-items: center; }
.version-chip { padding: 6px 9px; border: 1px solid rgba(255,255,255,.23); border-radius: 5px; color: #c5d1df; font-size: 10px; }
.admin-layout { display: grid; grid-template-columns: 160px 1fr; gap: 22px; padding-block: 26px 90px; align-items: start; }
.admin-nav { position: sticky; top: 15px; display: flex; flex-direction: column; gap: 2px; padding: 7px; border: 1px solid var(--line); border-radius: 10px; }
.admin-nav a { padding: 8px; border-radius: 6px; color: #65738a; font-size: 11px; }
.admin-nav a:hover { color: var(--navy); background: #f1f6f6; }
.admin-main { min-width: 0; }
.admin-section { padding: 15px 0 32px; scroll-margin-top: 20px; }
.admin-section + .admin-section { border-top: 1px solid var(--line); }
.admin-section .section-heading { margin-bottom: 15px; }
.admin-section .section-heading h2 { font-size: 24px; }
.metric-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 14px; }
.metric-card { display: grid; gap: 8px; padding: 15px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.metric-card small { color: #75839a; font-size: 10px; }
.metric-card strong { color: var(--navy); font-size: 27px; line-height: 1; }
.admin-section .content-card { margin-bottom: 13px; box-shadow: none; }
.tool-admin-row { display: grid; grid-template-columns: minmax(150px,1fr) auto auto auto 110px auto; align-items: center; gap: 10px; padding: 9px 11px; border-bottom: 1px solid #e9eef2; background: #fff; }
.tool-admin-name { display: grid; }
.tool-admin-name strong { color: var(--navy); font-size: 10px; }
.tool-admin-name small { color: #8190a2; font-size: 9px; }
.toggle-label { display: flex; align-items: center; gap: 4px; color: #5f6d82; font-size: 9px; white-space: nowrap; }
.toggle-label input { accent-color: #009987; }
.quota-label { display: flex; gap: 5px; align-items: center; color: #5f6d82; font-size: 9px; white-space: nowrap; }
.quota-label input { width: 52px; padding: 5px; border: 1px solid #d7e0e8; border-radius: 4px; font-size: 10px; }
.table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 8px; }
table { width: 100%; border-collapse: collapse; min-width: 700px; text-align: left; }
th,td { padding: 10px; border-bottom: 1px solid #e9eef2; color: #5e6c82; font-size: 10px; }
th { background: #f6f9fa; color: #3e4c62; font-weight: 750; }
.text-button { padding: 0; border: 0; background: none; color: #087f73; font-size: 10px; font-weight: 700; }
.cms-layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; padding-bottom: 90px; }
.cms-layout .content-card { align-self: start; }
.cms-layout .content-card + .content-card { margin-top: 15px; }
.canonical-editor-note { display: grid; gap: 5px; padding: 12px 14px; border: 1px solid #dce8eb; border-radius: 9px; background: #f6fbfa; color: #617286; font-size: 11px; }
.canonical-editor-note strong { color: var(--navy); font-size: 12px; }
.canonical-editor-note code { overflow-wrap: anywhere; color: #087e71; font-size: 11px; }
.canonical-warning { padding: 12px 14px; border: 1px solid #efd6b1; border-radius: 9px; background: #fff9ee; color: #80571d; font-size: 11px; }
.canonical-warning ul { margin: 7px 0 0; padding-left: 18px; }
.canonical-warning-text { color: #9a5929 !important; }
.canonical-history { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.canonical-history .data-row { align-items: flex-start; }
.canonical-history .data-row > div { min-width: 0; }
.canonical-history .data-row strong { overflow-wrap: anywhere; }
.canonical-history time { color: var(--muted); font-size: 10px; white-space: nowrap; }
.publish-status { display: grid; grid-template-columns: auto auto; align-items: center; justify-content: start; gap: 8px 12px; padding: 13px; border: 1px solid var(--line); border-radius: 9px; background: #f8fafc; }
.publish-status > small { grid-column: 1 / -1; color: var(--muted); font-size: 11px; }
.status-pill { display: inline-flex; width: fit-content; padding: 4px 9px; border-radius: 30px; font-size: 11px; font-weight: 750; }
.status-published { color: #17634f; background: #e0f5ec; }
.status-draft { color: #755a23; background: #fff1cf; }
.archive-form { margin-top: 14px; }
.menu-manager { margin-bottom: 80px; }
.menu-item-list { display: grid; gap: 12px; margin: 18px 0 28px; }
.menu-item-form { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfe; }
.menu-item-form .form-grid { margin: 0; }
.menu-item-form .button { justify-self: start; }
.media-library { display: grid; gap: 10px; max-height: 460px; margin-top: 14px; overflow: auto; }
.media-item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px; border: 1px solid var(--line); border-radius: 8px; }
.media-item img { width: 56px; height: 48px; object-fit: cover; border-radius: 5px; background: #eef2f6; }
.media-item code { display: block; overflow-wrap: anywhere; font-size: 10px; }
.media-item small { color: var(--muted); font-size: 10px; }
.cms-preview-banner { display: flex; align-items: center; gap: 15px; margin-top: 24px; padding: 14px 18px; border: 1px solid #efd48d; border-radius: 10px; background: #fff8e8; color: #604b1d; }
.cms-preview-banner span { flex: 1; font-size: 13px; }

@media (max-width: 960px) {
  .primary-nav { gap: 17px; }
  .hero { gap: 12px; }
  .hero-visual { transform: scale(.9); }
  .how-grid { gap: 50px; }
  .split-feature { gap: 42px; }
  .benefit-row { grid-template-columns: repeat(2,1fr); }
  .tool-admin-row { grid-template-columns: 1fr 1fr 1fr; }
  .tool-admin-name { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .wrap,.nav-wrap { width: min(100% - 32px, 560px); }
  .site-header { height: 69px; }
  .menu-toggle { display: block; }
  .primary-nav { display: none; position: absolute; inset: 68px 0 auto; padding: 15px 20px 20px; flex-direction: column; align-items: stretch; gap: 6px; border-bottom: 1px solid var(--line); background: white; box-shadow: 0 12px 20px rgba(21,39,62,.09); }
  .primary-nav.open { display: flex; }
  .primary-nav > a:not(.button),.nav-button { padding: 10px; text-align: left; }
  .primary-nav .button { align-self: flex-start; margin: 5px 0 0; }
  .hero { padding-block: 55px 53px; grid-template-columns: 1fr; gap: 8px; }
  .hero h1 { font-size: clamp(42px,12vw,59px); }
  .hero-lede { margin-block: 18px 21px; font-size: 15px; }
  .hero-audit { flex-direction: column; border: 0; padding: 0; box-shadow: none; }
  .hero-audit input { min-height: 49px; border: 1px solid #dbe3ed; border-radius: 8px; background: white; }
  .hero-audit .button { width: 100%; }
  .hero-links { font-size: 10px; }
  .hero-visual { min-height: 370px; margin-top: 9px; transform: scale(.9); }
  .report-card { width: min(350px, 95vw); }
  .chip-left { left: -12px; top: 55px; }
  .chip-right { right: -14px; bottom: 35px; }
  .floating-chip { padding: 8px; }
  .trust-inner { min-height: auto; padding-block: 14px; display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; font-size: 9px; }
  .section { padding-block: 62px; }
  .section-heading { align-items: flex-start; flex-direction: column; margin-bottom: 22px; }
  .section h2,.section-heading h2 { font-size: 34px; }
  .tool-grid,.tool-grid-compact { grid-template-columns: 1fr; gap: 10px; }
  .tool-card,.tool-grid-compact .tool-card { min-height: 190px; }
  .how-grid,.split-feature { grid-template-columns: 1fr; gap: 33px; }
  .how-grid .button { min-height: 43px; }
  .steps li { grid-template-columns: 35px 1fr; gap: 10px; }
  .feature-art { min-height: 235px; }
  .category-row { grid-template-columns: 1fr; }
  .benefit-row { grid-template-columns: 1fr; gap: 21px; }
  .benefit-row h2 br { display: none; }
  .cta-band { align-items: flex-start; flex-direction: column; gap: 22px; }
  .pricing-preview,.faq-preview { grid-template-columns: 1fr; gap: 25px; }
  .pricing-preview { gap: 23px; }
  .plan-preview { grid-template-columns: 1fr; }
  .plan-preview p { min-height: auto; }
  .cta-register { margin: 12px 0 0; }
  .footer-top { grid-template-columns: repeat(2,1fr); gap: 30px 20px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 6px; }
  .page-hero { padding-top: 49px; padding-bottom: 29px; }
  .page-hero h1 { font-size: 42px; }
  .about-hero { grid-template-columns: 1fr; gap: 25px; padding-block: 48px 26px; }
  .about-hero h1 { font-size: 42px; }
  .about-layout { grid-template-columns: 1fr; gap: 28px; }
  .about-aside { position: static; }
  .lede { font-size: 14px; }
  .directory-group { padding-block: 16px 27px; }
  .tool-workspace { grid-template-columns: 1fr; }
  .tool-panel,.aside-card,.content-card { padding: 18px; }
  .content-page { grid-template-columns: 1fr; gap: 24px; }
  .auth-layout { grid-template-columns: 1fr; gap: 25px; padding-block: 48px 65px; }
  .auth-copy { padding-left: 0; }
  .auth-copy h1 { font-size: 47px; }
  .auth-points { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; font-size: 10px; }
  .auth-card { padding: 22px; }
  .account-layout { grid-template-columns: 1fr; }
  .account-nav { display: grid; grid-template-columns: repeat(3,1fr); }
  .blog-grid { grid-template-columns: 1fr; gap: 13px; }
  .article-header { margin-top: 30px; }
  .article-header h1 { font-size: 41px; }
  .article-cover { border-radius: 10px; margin-bottom: 25px; }
  .article-content { font-size: 14px; }
  .article-content h2 { font-size: 23px; }
  .article-meta { flex-wrap: wrap; gap: 8px 14px; }
  .admin-layout { grid-template-columns: 1fr; }
  .admin-nav { position: static; display: flex; flex-direction: row; overflow: auto; white-space: nowrap; }
  .admin-nav a { flex: 0 0 auto; }
  .metric-grid { grid-template-columns: repeat(2,1fr); }
  .tool-admin-row { grid-template-columns: 1fr 1fr; }
  .quota-label { justify-content: flex-start; }
  .cms-layout { grid-template-columns: 1fr; }
  .menu-item-form .form-grid { grid-template-columns: 1fr; }
  .media-item { grid-template-columns: 48px minmax(0, 1fr); }
  .media-item .button { grid-column: 2; justify-self: start; }
  .cms-preview-banner { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 390px) {
  .hero-visual { margin-inline: -13px; transform: scale(.82); }
  .report-card { padding: 17px; }
  .hero-links { flex-direction: column; gap: 8px; }
  .footer-top { gap: 25px 12px; }
  .footer-column a { font-size: 10px; }
  .account-nav { grid-template-columns: repeat(2,1fr); }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Seoptiz visual refresh: warm field-note surfaces, clear evidence, and a distinct cypress accent. */
:root {
  --navy: #244f45;
  --navy-2: #1d4038;
  --navy-3: #396f5f;
  --ink: #29332e;
  --muted: #69736b;
  --muted-dark: #aab5a8;
  --line: #d8d4c9;
  --surface: #f4f0e7;
  --surface-2: #ebe5d8;
  --teal: #b7c49a;
  --teal-dark: #244f45;
  --blue: #496b6c;
  --amber: #d4a55d;
  --red: #b95f4a;
  --radius: 6px;
  --shadow: 0 20px 55px rgba(40, 49, 42, .10);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
  color: var(--ink);
  background: var(--surface);
}

h1, h2 {
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  font-weight: 500;
}

a:hover { color: var(--navy-3); }
::selection { color: var(--navy-2); background: rgba(183, 196, 154, .55); }
:focus-visible { outline-color: #a45e46; }

.site-header {
  background: rgba(244, 240, 231, .96);
  border-bottom-color: rgba(91, 103, 89, .18);
  backdrop-filter: blur(12px);
}
.brand { color: var(--navy-2); }
.brand small { color: #70786d; }
.primary-nav { color: #5d675f; }
.primary-nav > a:hover,
.primary-nav > a.active,
.nav-button:hover { color: var(--navy-3); }
.primary-nav .button { color: #f7f3e9; }
.primary-nav .button:hover { color: #fffaf0; }
.menu-toggle { background: var(--surface); border-color: var(--line); }
.menu-toggle span:not(.sr-only) { background: var(--navy); }

.button {
  border-color: var(--navy);
  border-radius: 3px;
  color: #f7f3e9;
  background: var(--navy);
  box-shadow: none;
}
.button:hover {
  color: #fffaf0;
  border-color: var(--navy-3);
  background: var(--navy-3);
  box-shadow: 0 8px 20px rgba(36, 79, 69, .18);
}
.button-outline {
  color: var(--navy);
  border-color: #c9c5b8;
  background: var(--surface);
}
.button-outline:hover {
  color: var(--navy);
  border-color: #a6b194;
  background: #eeeadf;
}
.button-ghost { color: #f4f0e7; border-color: rgba(244, 240, 231, .36); background: transparent; }
.button-ghost:hover { color: #fffaf0; background: rgba(244, 240, 231, .09); }
.section-dark .button:not(.button-ghost) { color: var(--navy-2); border-color: var(--teal); background: var(--teal); }
.section-dark .button:not(.button-ghost):hover { color: var(--navy-2); border-color: #c5d0a9; background: #c5d0a9; }

.hero {
  position: relative;
  isolation: isolate;
  min-height: 620px;
  padding-top: 65px;
  padding-bottom: 65px;
  background-image:
    linear-gradient(rgba(36, 79, 69, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(36, 79, 69, .035) 1px, transparent 1px);
  background-size: 38px 38px;
  border-bottom: 1px solid rgba(91, 103, 89, .14);
}
.hero::after {
  position: absolute;
  z-index: -1;
  inset: 0 0 0 48%;
  content: "";
  background: radial-gradient(ellipse at 55% 48%, rgba(212, 165, 93, .22), transparent 62%);
  pointer-events: none;
}
.eyebrow { color: #a45e46; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 10px; letter-spacing: .1em; }
.status-dot { background: #a45e46; box-shadow: 0 0 0 4px rgba(164, 94, 70, .13); }
.hero h1 {
  max-width: 670px;
  color: var(--ink);
  font-size: clamp(48px, 4.5vw, 68px);
  line-height: .99;
  letter-spacing: -.055em;
}
.hero h1 span { color: var(--navy-3); font-style: italic; font-weight: 400; }
.hero-lede { color: #626b63; font-size: 16px; line-height: 1.75; }
.hero-audit {
  gap: 0;
  padding: 7px;
  border-color: #d5d0c3;
  border-radius: 3px;
  background: #fbf9f3;
  box-shadow: 0 13px 30px rgba(52, 53, 42, .08);
}
.hero-audit input { min-height: 48px; color: var(--ink); }
.hero-audit input::placeholder { color: #91958a; }
.hero-audit .button { border-radius: 2px; }
.hero-links { color: #747d72; }
.hero-links a { color: var(--navy); }
.hero-visual::before { background: radial-gradient(circle, rgba(212, 165, 93, .24), rgba(57, 111, 95, .06) 52%, transparent 72%); }
.visual-orbit { border-color: rgba(36, 79, 69, .18); }
.report-card {
  border-color: #dcd8ca;
  border-radius: 2px;
  background: #fbf9f3;
  box-shadow: 0 25px 55px rgba(40, 49, 42, .16);
  transform: rotate(-1.5deg);
}
.report-kicker,.report-status,.report-domain small,.score-ring small,.report-line b { color: #777f75; }
.domain-symbol { border-radius: 2px; color: var(--navy); background: #e5eadb; }
.score-ring { border-color: var(--navy-3); box-shadow: inset 0 0 0 4px #e8eee1; }
.check-mark { color: var(--navy); background: #e4ecdf; }
.warning-mark { color: #966942; background: #f5ebd8; }
.report-line,.report-foot { border-color: #e5e1d7; }
.floating-chip { border-color: #ded9cd; border-radius: 3px; background: #fbf9f3; box-shadow: 0 10px 22px rgba(40, 49, 42, .09); }
.floating-chip small { color: #858b81; }
.floating-chip strong { color: var(--navy); }
.chip-icon { border-radius: 2px; color: var(--navy); background: #e5e9dc; }
.chip-teal { color: #8b6040; background: #f2e8d7; }

.trust-strip { background: #ede9df; border-color: #dcd7ca; }
.trust-inner { color: #616961; }
.section { padding-block: 84px; }
.section h2,.section-heading h2,.faq-preview h2 {
  color: var(--ink);
  font-size: clamp(34px, 3.7vw, 50px);
  font-weight: 500;
  letter-spacing: -.045em;
}
.section-heading .eyebrow { margin-bottom: 14px; }
.text-link { color: var(--navy); }
.text-link span,.tool-link span { color: #a45e46; }
.tool-grid { gap: 12px; }
.tool-card {
  min-height: 230px;
  padding: 23px;
  border-color: #d8d4c9;
  border-radius: 3px;
  background: #fbf9f3;
}
.tool-card:hover {
  border-color: #aeb99a;
  box-shadow: 0 12px 28px rgba(40, 49, 42, .09);
}
.tool-icon { border-radius: 2px; color: var(--navy); background: #e5eadb; }
.card-category { color: #a45e46; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.tool-card h3 { color: var(--navy-2); }
.tool-card p { color: #69736b; }
.tool-link { color: var(--navy); }

.section-dark { color: #f4f0e7; background: var(--navy); }
.section-dark h2,.section-dark h3 { color: #f4f0e7; }
.section-dark .eyebrow { color: #d4bd7e; }
.muted-copy,.steps p { color: #c4d0c5; }
.steps li { border-color: rgba(239, 239, 222, .22); }
.steps li > span { color: #d4bd7e; }
.split-feature { gap: 65px; }
.split-feature p:not(.eyebrow) { color: #687168; }
.feature-art { border: 1px solid #ded9cd; border-radius: 2px; background: #eceee2; }
.feature-list { color: #47544b; }
.feature-list li { border-color: #e6e1d6; }
.feature-list li::before { color: var(--navy-3); }
.section-tint { background: var(--surface-2); }
.category-row { gap: 0 18px; }
.category-pill {
  border: 0;
  border-bottom: 1px solid #cfcbbf;
  border-radius: 0;
  background: transparent;
}
.category-pill:hover { border-color: #a6b194; background: rgba(251, 249, 243, .4); }
.category-number,.benefit-number { color: #a45e46; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.benefit-row { gap: 24px; }
.benefit h3 { color: var(--navy-2); }
.benefit p { color: #71796f; }
.cta-band > div:last-child p { color: #c4d0c5; }
.cta-register { color: #e8e6dc; }
.cta-register:hover { color: #d4bd7e; }
.pricing-preview h2 { color: var(--ink); font: 500 clamp(34px, 3.7vw, 50px)/1.07 "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif; letter-spacing: -.045em; }
.pricing-preview > div:first-child > p:not(.eyebrow) { color: #69736b; }
.plan-preview { gap: 0; border: 1px solid #d8d4c9; background: #fbf9f3; }
.plan-preview > div { padding: 23px; border: 0; border-radius: 0; background: transparent; }
.plan-preview > div + div { border-left: 1px solid #d8d4c9; }
.plan-label { color: #a45e46; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.plan-preview strong { color: var(--navy); }
.plan-preview p,.plan-preview ul { color: #687168; }
.plan-preview li { border-color: #e6e1d6; }
.faq-preview { gap: 70px; }
.faq-preview h2 { margin-bottom: 16px; }
.faq-list details { border-color: #d8d4c9; }
.faq-list summary { color: var(--navy); }
.faq-list summary::after { color: #a45e46; }
.faq-list details p { color: #69736b; }
.site-footer { background: #eae6da; border-color: #d8d4c9; }
.footer-brand p,.footer-column a { color: #69736b; }
.footer-column h2 { color: var(--navy); }
.footer-column a:hover { color: #a45e46; }
.footer-bottom { border-color: #d8d4c9; color: #81867b; }
.footer-bottom a { color: var(--navy); }

.page-hero h1,.about-hero h1,.article-header h1,.auth-copy h1,.error-page h1,.message-page h1 {
  color: var(--ink);
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  font-weight: 500;
  letter-spacing: -.05em;
}
.lede,.about-copy,.content-copy { color: #626c63; }
.tool-search label,.blog-search label { color: #536157; }
.tool-search input,.blog-search input,
.tool-form input,.tool-form textarea,.tool-form select,
.stack-form input,.stack-form textarea,.stack-form select,
.inline-form input {
  color: var(--ink);
  border-color: #d3cfc3;
  border-radius: 3px;
  background: #fbf9f3;
}
.tool-panel,.aside-card,.content-card,.auth-card,.registration-modal {
  border-color: #d8d4c9;
  border-radius: 3px;
  background: #fbf9f3;
  box-shadow: 0 10px 28px rgba(40, 49, 42, .055);
}
.panel-title { border-color: #e5e1d7; }
.panel-title h2,.aside-card h2,.aside-card h3,.content-card h2,.content-card h3 { color: var(--navy); }
.panel-title p,.aside-card p,.content-card p { color: #71796f; }
.safety-card,.tool-limit-status { color: #34594e; border-color: #d2deca; background: #edf0e4; }
.safety-icon { color: var(--navy); background: #dce5d0; }
.registration-required { border-color: #ddc9a5; background: #f4ecdc; }
.registration-required p { color: #6b6c60; }
.registration-modal::backdrop { background: rgba(29, 48, 41, .58); }
.result-output { border-color: #34584c; border-radius: 3px; color: #e6ebe1; background: #1d4038; }
.result-note { color: #78857a; }
.result-message { border-radius: 3px; }
.result-message.error { border-color: #e4c8bd; color: #7c4134; background: #f7ebe5; }
.cookie-notice {
  border-color: #d4cfc1;
  border-left: 4px solid #a45e46;
  border-radius: 3px;
  background: #fbf9f3;
  box-shadow: 0 16px 44px rgba(40, 49, 42, .18);
}
.cookie-notice strong { color: var(--navy); }
.cookie-notice p { color: #69736b; }
.cookie-notice a { color: #a45e46; }

.about-hero-image,.article-cover { border: 1px solid #d8d4c9; border-radius: 3px; background: #eceee2; box-shadow: 0 12px 30px rgba(40, 49, 42, .08); }
.about-hero-image figcaption { color: #69736b; }
.about-copy h2,.content-copy h2,.content-copy h3 { color: var(--navy); }
.about-aside,.content-aside { border-color: #d8d4c9; border-radius: 3px; background: #ebe8dd; }
.about-aside h2,.content-aside h2 { color: var(--navy); }
.about-aside p:not(.eyebrow),.content-aside p:not(.eyebrow) { color: #69736b; }
.error-code { color: #d8d4c9; }
.success-icon { color: var(--navy); background: #e4ecdf; }
.auth-copy > p:not(.eyebrow),.auth-card > p,.auth-switch { color: #69736b; }
.auth-points { color: #536157; }
.auth-switch a,.checkbox-label a { color: var(--navy-3); }
.checkbox-label input { accent-color: var(--navy-3); }
.math-captcha { display: grid; gap: 8px; padding: 14px; border: 1px solid #d8d4c9; border-radius: 4px; background: #f4f1e8; }
.math-captcha label { margin: 0; color: var(--navy); font-weight: 700; }
.math-captcha input { max-width: 180px; }
.math-captcha small,.captcha-session-note { color: #69736b; font-size: 12px; line-height: 1.5; }
.contact-form { max-width: 720px; }
.contact-related a { color: var(--navy-3); }
.account-nav { border-color: #d8d4c9; border-radius: 3px; }
.account-nav a { color: #69736b; border-radius: 2px; }
.account-nav a:hover { color: var(--navy); background: #ebe8dd; }
.data-row { border-color: #e6e1d6; color: #536157; }
.data-row strong { color: var(--navy); }
.account-shortcuts { color: var(--navy-3); }
.blog-card { border-color: #d8d4c9; border-radius: 3px; background: #fbf9f3; }
.blog-image { background: #eceee2; }
.blog-card-body h2 { color: var(--navy); font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif; font-weight: 500; }
.blog-card-body h2 a:hover { color: #a45e46; }
.blog-card-body p:not(.card-category) { color: #69736b; }
.breadcrumbs { color: #7b8178; }
.breadcrumbs a { color: var(--navy); }
.article-header h1 { font-size: clamp(42px, 6vw, 68px); }
.article-meta { color: #7b8178; }
.article-content { color: #48554c; }
.article-content h2,.article-content h3 { color: var(--navy); }
.article-content a { color: var(--navy-3); }
.article-content blockquote { border-color: #a45e46; background: #ebe8dd; color: #536157; }

.admin-top { background: var(--navy-2); }
.version-chip { border-color: rgba(244, 240, 231, .26); color: #d7ded3; }
.admin-nav { border-color: #d8d4c9; border-radius: 3px; }
.admin-nav a { color: #69736b; border-radius: 2px; }
.admin-nav a:hover { color: var(--navy); background: #ebe8dd; }
.metric-card { border-color: #d8d4c9; border-radius: 3px; background: #fbf9f3; }
.metric-card small,.data-row small,.data-row time { color: #7c857a; }
.metric-card strong { color: var(--navy); }
.tool-admin-row,.menu-item-form { border-color: #e6e1d6; background: #fbf9f3; }
.tool-admin-name strong { color: var(--navy); }
.tool-admin-name small,.toggle-label,.quota-label { color: #69736b; }
.toggle-label input { accent-color: var(--navy-3); }
.quota-label input { border-color: #d3cfc3; border-radius: 3px; background: #fbf9f3; }
.table-wrap { border-color: #d8d4c9; border-radius: 3px; }
th,td { border-color: #e6e1d6; color: #536157; }
th { color: var(--navy); background: #ebe8dd; }
.text-button { color: var(--navy-3); }
.publish-status { border-color: #d8d4c9; border-radius: 3px; background: #f1eee5; }
.status-published { color: #315c4c; background: #e0e8d9; }
.status-draft { color: #795f39; background: #f1e8d5; }
.menu-item-form,.media-item { border-color: #d8d4c9; border-radius: 3px; }
.media-item img { border-radius: 2px; background: #ebe8dd; }
.cms-preview-banner { border-color: #ddc9a5; border-radius: 3px; background: #f4ecdc; color: #6e5636; }

@media (max-width: 960px) {
  .hero { min-height: 570px; }
  .hero-visual { transform: scale(.88); }
  .how-grid { gap: 42px; }
  .split-feature { gap: 38px; }
  .pricing-preview { gap: 38px; }
}

@media (max-width: 720px) {
  .primary-nav { background: var(--surface); box-shadow: 0 12px 20px rgba(40, 49, 42, .1); }
  .hero {
    min-height: auto;
    padding-block: 48px 40px;
    background-size: 30px 30px;
  }
  .hero::after { inset: 38% 0 0; }
  .hero h1 { font-size: clamp(43px, 11.5vw, 58px); }
  .hero-lede { font-size: 14px; }
  .hero-audit { gap: 8px; padding: 0; border: 0; background: transparent; box-shadow: none; }
  .hero-audit input { min-height: 48px; padding-inline: 13px; border: 1px solid #d5d0c3; border-radius: 2px; background: #fbf9f3; }
  .hero-audit .button { min-height: 48px; }
  .hero-visual { min-height: 360px; transform: scale(.86); }
  .report-card { width: min(350px, 94vw); }
  .floating-chip { padding: 8px; }
  .section { padding-block: 58px; }
  .section h2,.section-heading h2,.faq-preview h2 { font-size: 35px; }
  .tool-card,.tool-grid-compact .tool-card { min-height: 185px; }
  .plan-preview > div + div { border-top: 1px solid #d8d4c9; border-left: 0; }
  .cookie-notice { right: 12px; bottom: 12px; grid-template-columns: 1fr; gap: 10px; width: calc(100% - 24px); padding: 14px; }
  .cookie-notice .button { justify-self: start; min-height: 38px; }
  .page-hero h1,.about-hero h1 { font-size: 44px; }
  .article-header h1 { font-size: 42px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero *, .tool-card, .blog-card, .button, .category-pill { animation: none !important; transition: none !important; }
}

.back-to-top {
  position: fixed;
  z-index: 29;
  right: 22px;
  bottom: 22px;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  padding: 0;
  border: 0;
  color: var(--navy);
  background: transparent;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px) rotate(-5deg);
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease, bottom .2s ease;
  cursor: pointer;
}
.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) rotate(-5deg);
}
.back-to-top svg {
  display: block;
  width: 64px;
  height: 64px;
  overflow: visible;
  filter: drop-shadow(0 8px 13px rgba(36, 53, 45, .22));
  transition: transform .2s ease, filter .2s ease;
}
.back-to-top-tag {
  fill: var(--navy);
  stroke: #d4bd7e;
  stroke-width: 1.5;
  stroke-linejoin: round;
}
.back-to-top-hole {
  fill: var(--surface);
  stroke: #d4bd7e;
  stroke-width: 1.5;
}
.back-to-top-arrow {
  fill: none;
  stroke: #f4f0e7;
  stroke-width: 2.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.back-to-top:hover svg { transform: translateY(-3px) rotate(5deg); filter: drop-shadow(0 12px 17px rgba(36, 53, 45, .28)); }
.back-to-top:focus-visible { outline: 2px solid #a45e46; outline-offset: 3px; border-radius: 50%; }
.cookie-notice:not([hidden]) ~ .back-to-top { bottom: 164px; }

@media (max-width: 720px) {
  .back-to-top { right: 14px; bottom: 15px; width: 56px; height: 56px; }
  .back-to-top svg { width: 56px; height: 56px; }
  .cookie-notice:not([hidden]) ~ .back-to-top { bottom: 198px; }
}

@media (prefers-reduced-motion: reduce) {
  .back-to-top,.back-to-top svg { transition: none !important; }
}

.toolbox-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(290px, .8fr);
  align-items: end;
  gap: 34px;
  padding-top: 48px;
  padding-bottom: 25px;
}
.toolbox-hero .eyebrow { display: flex; align-items: center; gap: 10px; }
.toolbox-hero-count { padding-left: 10px; border-left: 1px solid #d4d0c4; color: #6c776d; font-size: 9px; letter-spacing: .08em; }
.toolbox-hero h1 { max-width: 720px; }
.toolbox-hero .lede { max-width: 690px; margin-top: 13px; font-size: 14px; }
.toolbox-search {
  max-width: none;
  margin: 0;
  gap: 8px;
  padding: 17px;
  border: 1px solid #d8d4c9;
  border-radius: 5px;
  background: #f7f5ee;
}
.toolbox-search-summary { display: flex; align-items: baseline; gap: 7px; margin-bottom: 2px; color: #6d776e; font-size: 10px; }
.toolbox-search-summary strong { color: #31574b; font-family: Georgia, serif; font-size: 24px; font-weight: 500; }
.toolbox-search-summary b { color: #344f43; font-weight: 750; }
.toolbox-search > label { color: #435347; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.toolbox-search-field { display: flex; min-height: 44px; align-items: center; gap: 9px; padding: 0 11px; border: 1px solid #d5d0c3; background: #fffefa; }
.toolbox-search-field .service-icon-svg { width: 17px; height: 17px; flex: 0 0 auto; color: #607769; }
.toolbox-search-field input { width: 100%; min-width: 0; height: 42px; padding: 0; border: 0; outline: 0; background: transparent; color: #24352f; font-size: 12px; }
.toolbox-search-field input:focus-visible { outline: 0; }
.toolbox-search > small { color: #7b8076; font-size: 9px; }
.toolbox-directory { padding-bottom: 76px; }
.toolbox-filter-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 0 0 16px; }
.toolbox-filter-heading .eyebrow { margin: 0 0 6px; }
.toolbox-filter-heading h2 { margin: 0; color: var(--navy); font-size: 24px; line-height: 1.2; letter-spacing: -.04em; }
.toolbox-filter-heading > p { max-width: 260px; margin: 0 0 2px; color: #72786e; font-size: 11px; text-align: right; }
.tool-category-filter { display: flex; gap: 7px; overflow-x: auto; padding: 5px 2px 12px; scrollbar-width: thin; scrollbar-color: #c9c7bb transparent; }
.tool-filter-button { display: inline-flex; flex: 0 0 auto; min-height: 37px; align-items: center; gap: 7px; padding: 5px 10px; border: 1px solid #d8d4c9; border-radius: 3px; color: #536359; background: #fbfaf6; font-size: 10px; font-weight: 650; white-space: nowrap; transition: color .16s ease, background .16s ease, border-color .16s ease; }
.tool-filter-button:hover,.tool-filter-button.is-active { border-color: #395b4d; color: #f8f6ef; background: #31574b; }
.tool-filter-icon { display: grid; width: 19px; height: 19px; place-items: center; }
.tool-filter-icon .service-icon-svg { width: 16px; height: 16px; }
.tool-filter-count { display: inline-grid; min-width: 18px; height: 18px; place-items: center; padding-inline: 4px; border: 1px solid currentColor; border-radius: 2px; font-size: 8px; opacity: .75; }
.toolbox-results-bar { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 0; border-top: 1px solid #dedbd1; }
.toolbox-results-bar p { margin: 0; color: #72786e; font-size: 10px; }
.toolbox-results-bar a { color: #3c5e50; font-size: 10px; font-weight: 750; }
.toolbox-results-bar a span { margin-left: 4px; }
.toolbox-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.toolbox-card,.tool-grid-compact .toolbox-card { min-height: 0; padding: 14px; border-color: #ddd9cf; border-radius: 4px; background: #fffefa; }
.toolbox-card:hover { border-color: #728b79; box-shadow: 0 9px 20px rgba(39, 59, 47, .09); transform: translateY(-2px); }
.toolbox-card-top { display: flex; align-items: center; justify-content: flex-start; gap: 8px; margin-bottom: 10px; }
.toolbox-card .tool-icon { width: 31px; height: 31px; flex: 0 0 31px; border: 1px solid #d5d9cc; border-radius: 3px; color: #365b4b; background: #edf0e7; }
.service-icon-svg { display: block; width: 20px; height: 20px; }
.toolbox-card-category { min-width: 0; margin-right: auto; overflow: hidden; color: #68776c; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.toolbox-card .card-arrow { color: #7f8d7f; font-size: 12px; }
.toolbox-card h3 { margin: 0 0 5px; color: #26382f; font-size: 13px; line-height: 1.3; letter-spacing: -.015em; }
.toolbox-card p { display: -webkit-box; min-height: 42px; margin: 0; overflow: hidden; color: #6f776e; font-size: 10px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.toolbox-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 11px; padding-top: 9px; border-top: 1px solid #ebe8de; }
.tool-access-badge { display: inline-flex; align-items: center; min-height: 20px; padding: 2px 6px; border: 1px solid #d9dfd2; border-radius: 2px; color: #42604e; background: #f1f3eb; font-size: 8px; font-weight: 700; white-space: nowrap; }
.tool-access-badge[data-access="account"] { border-color: #e0d4b8; color: #806342; background: #f8f1e4; }
.toolbox-open { display: inline-flex; align-items: center; gap: 5px; color: #365b4b; font-size: 9px; font-weight: 800; }
.toolbox-open span { transition: transform .16s ease; }
.toolbox-card:hover .toolbox-open span { transform: translateX(3px); }
.toolbox-card[hidden] { display: none !important; }
.toolbox-empty { margin: 15px 0 0; padding: 20px; border: 1px dashed #c9c7bb; color: #6f776e; background: #f7f5ee; font-size: 12px; text-align: center; }

.pricing-hero { padding-top: 57px; padding-bottom: 31px; }
.pricing-hero .lede { max-width: 770px; }
.pricing-page { padding-bottom: 78px; }
.pricing-why { display: grid; grid-template-columns: minmax(190px, .55fr) minmax(0, 1.45fr); gap: 28px; padding: 25px; border: 1px solid #d6d4c8; background: #f1efe6; }
.pricing-why-label { display: flex; align-items: flex-start; gap: 11px; }
.pricing-why-label .eyebrow { margin: 3px 0 0; }
.pricing-why-mark { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border: 1px solid #a9b39f; color: #385b4b; font-family: Georgia, serif; font-size: 11px; }
.pricing-why h2 { max-width: 660px; margin: 0 0 10px; color: #293a30; font-family: Georgia, serif; font-size: clamp(23px, 3vw, 32px); font-weight: 500; line-height: 1.18; letter-spacing: -.03em; }
.pricing-why > div:last-child > p { max-width: 740px; margin: 0; color: #5e6b61; font-size: 12px; line-height: 1.75; }
.pricing-services-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 40px 0 17px; }
.pricing-services-heading .eyebrow { margin: 0 0 7px; }
.pricing-services-heading h2 { margin: 0; color: #293a30; font-size: clamp(23px, 3vw, 30px); line-height: 1.2; letter-spacing: -.04em; }
.pricing-services-heading .text-link { color: #3c5e50; font-size: 11px; white-space: nowrap; }
.pricing-service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pricing-service-card { min-height: 185px; padding: 17px; border: 1px solid #ddd9cf; background: #fffefa; }
.pricing-service-icon { display: grid; width: 35px; height: 35px; place-items: center; margin-bottom: 13px; border: 1px solid #d7dccf; color: #365b4b; background: #edf0e7; }
.pricing-service-icon .service-icon-svg { width: 19px; height: 19px; }
.pricing-service-card .card-category { margin: 0 0 5px; color: #7c826f; font-size: 8px; }
.pricing-service-card h3 { margin: 0 0 6px; color: #293a30; font-size: 14px; line-height: 1.35; }
.pricing-service-card > p:last-child { margin: 0; color: #69736a; font-size: 10px; line-height: 1.65; }
.pricing-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 24px; padding: 18px 0; border-block: 1px solid #dedbd1; }
.pricing-principles > div { display: flex; align-items: flex-start; gap: 10px; }
.pricing-principle-number { display: grid; width: 23px; height: 23px; flex: 0 0 23px; place-items: center; border: 1px solid #c8cbbd; color: #476452; font-family: Georgia, serif; font-size: 9px; }
.pricing-principles h3 { margin: 0 0 3px; color: #34493c; font-size: 11px; }
.pricing-principles p { margin: 0; color: #6f776e; font-size: 9px; line-height: 1.55; }
.pricing-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 27px; padding: 23px 25px; color: #f7f4eb; background: #2f5144; }
.pricing-cta .eyebrow { margin: 0 0 5px; color: #d1b677; }
.pricing-cta h2 { margin: 0; color: #fffdf8; font-size: 22px; line-height: 1.2; }
.pricing-cta .button { color: #2f5144; background: #f2eedf; }

@media (max-width: 980px) {
  .toolbox-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pricing-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .toolbox-hero { grid-template-columns: 1fr; gap: 18px; padding-top: 42px; }
  .toolbox-search { padding: 14px; }
  .toolbox-filter-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
  .toolbox-filter-heading > p { text-align: left; }
  .toolbox-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .pricing-hero { padding-top: 43px; }
  .pricing-why { grid-template-columns: 1fr; gap: 14px; padding: 18px; }
  .pricing-services-heading { align-items: flex-start; flex-direction: column; gap: 10px; margin-top: 29px; }
  .pricing-service-grid { gap: 8px; }
  .pricing-principles { grid-template-columns: 1fr; gap: 13px; }
  .pricing-cta { align-items: flex-start; flex-direction: column; padding: 19px; }
}
@media (max-width: 480px) {
  .toolbox-grid { grid-template-columns: 1fr; }
  .toolbox-card p { min-height: 0; }
  .toolbox-results-bar { align-items: flex-start; flex-direction: column; gap: 5px; }
  .pricing-service-grid { grid-template-columns: 1fr; }
  .pricing-service-card { min-height: 0; }
}

.faq-page-hero { padding-bottom: 28px; }
.faq-page-hero .lede { max-width: 760px; }
.faq-page-hero .text-link { display: inline-flex; gap: 7px; margin-top: 12px; color: #365b4b; font-size: 11px; font-weight: 750; }
.faq-page { max-width: 980px; padding-bottom: 86px; }
.faq-page > .eyebrow { margin-bottom: 12px; }
.faq-knowledge { border-top: 1px solid #dedbd1; }
.faq-knowledge details,.faq-knowledge > section { border-bottom: 1px solid #dedbd1; }
.faq-knowledge summary { display: block; padding: 18px 38px 18px 0; color: #293a30; font-size: 15px; line-height: 1.4; }
.faq-knowledge summary::-webkit-details-marker { display: none; }
.faq-knowledge summary::after { top: 17px; right: 4px; color: #a45e46; }
.faq-knowledge details[open] summary { color: #31574b; }
.faq-answer { padding: 0 35px 17px 0; }
.faq-knowledge .faq-answer p { max-width: 850px; padding: 0 0 10px; color: #626e64; font-size: 12px; line-height: 1.75; }
.faq-knowledge .faq-answer p:last-child { padding-bottom: 0; }
.faq-knowledge > section { padding: 18px 0; }
.faq-knowledge > section > h2 { margin: 0 0 10px; color: #293a30; font-size: 15px; }
.faq-knowledge > section > p { max-width: 850px; margin: 0 0 10px; color: #626e64; font-size: 12px; line-height: 1.75; }
.faq-knowledge > section > p:last-child { margin-bottom: 0; }
@media (max-width: 720px) {
  .faq-page-hero { padding-bottom: 23px; }
  .faq-page { padding-bottom: 64px; }
  .faq-knowledge summary { padding-block: 16px; font-size: 14px; }
  .faq-knowledge summary::after { top: 14px; }
  .faq-answer { padding-right: 20px; }
}

.ad-placement { margin: 28px auto 42px; text-align: center; }
.ad-label { margin: 0 0 8px; color: #69736b; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.ad-placement-track { display: flex; align-items: flex-start; justify-content: center; gap: 16px; max-width: 100%; overflow-x: auto; padding: 4px 2px 12px; scroll-snap-type: x proximity; }
.ad-unit { display: grid; flex: 0 0 auto; place-items: center; max-width: 100%; overflow: hidden; scroll-snap-align: center; }
.ad-size--medium-rectangle { width: 300px; height: 250px; }
.ad-size--large-rectangle { width: 336px; height: 280px; }
.ad-size--leaderboard { width: 728px; height: 90px; }
.ad-size--half-page { width: 300px; height: 600px; }
.ad-unit .adsbygoogle { display: block; max-width: 100%; }
.ad-size--medium-rectangle .adsbygoogle { width: 300px; height: 250px; }
.ad-size--large-rectangle .adsbygoogle { width: 336px; height: 280px; }
.ad-size--leaderboard .adsbygoogle { width: 728px; height: 90px; }
.ad-size--half-page .adsbygoogle { width: 300px; height: 600px; }
.ad-unit img { display: block; width: 100%; height: 100%; object-fit: contain; }
.related-strip { margin: 58px auto 48px; }
.related-strip .section-heading { margin-bottom: 18px; }
.related-strip .section-heading h2 { margin: 0; color: #293a30; font-size: clamp(23px, 3vw, 31px); }
.related-track { display: flex; gap: 14px; overflow-x: auto; padding: 4px 2px 14px; scroll-snap-type: x mandatory; }
.related-card { display: grid; flex: 0 0 min(280px, calc(100vw - 48px)); align-content: start; gap: 9px; padding: 13px; border: 1px solid #dedbd1; border-radius: 4px; background: #f9f8f2; color: inherit; scroll-snap-align: start; text-decoration: none; transition: border-color .18s ease, transform .18s ease; }
.related-card:hover { border-color: #31574b; color: inherit; transform: translateY(-2px); }
.related-card-image { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 2px; background: #ebe8dd; }
.related-card-icon { display: grid; width: 100%; height: 88px; place-items: center; background: #ebe8dd; color: #31574b; font-size: 32px; }
.related-card-category { color: #8a6251; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.related-card strong { color: #293a30; font-size: 16px; line-height: 1.3; }
.related-card-description { display: -webkit-box; overflow: hidden; color: #69736b; font-size: 12px; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.related-card-link { margin-top: 3px; color: #31574b; font-size: 11px; font-weight: 750; }
.ad-edit-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-bottom: 10px; }
.ad-edit-form > label { display: grid; gap: 6px; color: #293a30; font-size: 12px; font-weight: 700; }
.ad-edit-form input,.ad-edit-form select { width: 100%; min-height: 39px; padding: 8px 10px; border: 1px solid #d8d4c9; border-radius: 3px; background: #fffefa; color: #293a30; font: inherit; }
.ad-edit-heading,.ad-edit-form > button,.ad-form-actions { grid-column: 1 / -1; }
.ad-edit-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ad-form-actions { display: flex; justify-content: flex-start; }
.ad-delete-form { margin: 0 0 24px; text-align: right; }
.form-help { margin: -5px 0 8px; color: #69736b; font-size: 11px; line-height: 1.6; }
.verification-card pre { max-width: 100%; overflow-x: auto; padding: 12px; background: #f3f1e8; font-size: 11px; }
.verification-card code { overflow-wrap: anywhere; }
.cron-note { border-left: 3px solid #31574b; }
@media (max-width: 720px) {
  .related-strip { margin-block: 42px 35px; }
  .related-strip .section-heading { align-items: flex-start; }
  .ad-edit-form { grid-template-columns: 1fr; }
  .ad-edit-heading,.ad-edit-form > button,.ad-form-actions { grid-column: auto; }
  .ad-placement-track { justify-content: flex-start; }
}

.information-page,.contact-page { display: grid; gap: 20px; padding-bottom: 78px; }
.documentation-hero .hero-actions { margin-top: 24px; }
.documentation-intro,.documentation-contents,.documentation-section,.contact-card,.developer-attribution { padding: clamp(20px, 3vw, 32px); }
.documentation-intro h2,.documentation-contents h2,.documentation-section h2,.contact-card h2,.developer-attribution h2 { font-size: clamp(21px, 2.5vw, 28px); }
.documentation-intro p,.documentation-intro li,.documentation-section p,.documentation-section li,.contact-card p,.developer-attribution p { max-width: 78ch; font-size: 14px; line-height: 1.8; }
.documentation-intro ol,.documentation-section ul { display: grid; gap: 9px; padding-left: 22px; color: #536178; }
.documentation-topic-links { display: flex; flex-wrap: wrap; gap: 10px; }
.documentation-topic-links a,.contact-related a { padding: 9px 12px; border: 1px solid #dedbd1; border-radius: 4px; color: #31574b; font-size: 12px; font-weight: 700; text-decoration: none; }
.documentation-topic-links a:hover,.contact-related a:hover { border-color: #31574b; background: #f2f3eb; }
.guide-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 16px 0; }
.guide-toolbar .search-field { flex: 1; max-width: 560px; }
.guide-toolbar input { width: 100%; min-height: 46px; padding: 0 14px; border: 1px solid #cfd4ce; border-radius: 4px; background: #fff; color: #293a30; font: inherit; }
.guide-toolbar input:focus-visible { outline: 3px solid #86a997; outline-offset: 2px; }
.guide-toolbar .result-count { margin: 0; color: #69736b; font-size: 12px; }
.guide-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.guide-filters .filter-button { padding: 8px 11px; }
.documentation-category { padding: 14px 0 30px; scroll-margin-top: 30px; }
.documentation-category-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin: 0 0 14px; }
.documentation-category-heading h2 { margin: 0; color: #293a30; font-size: clamp(20px, 2.5vw, 27px); }
.documentation-category-heading span { color: #69736b; font-size: 12px; }
.guide-grid { display: grid; gap: 14px; }
.guide-card { overflow: hidden; border: 1px solid #dedbd1; border-radius: 5px; background: #fff; scroll-margin-top: 24px; }
.guide-card-header { padding: 18px 20px 13px; background: #f7f6ef; }
.guide-card-header .eyebrow { margin-bottom: 7px; }
.guide-card-header h3 { margin: 0 0 8px; font-size: 18px; }
.guide-card-header h3 a { color: #293a30; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.guide-card-header p:last-child { max-width: 86ch; margin-bottom: 0; font-size: 13px; line-height: 1.65; }
.guide-card-body { display: grid; gap: 8px; padding: 16px 20px 20px; }
.guide-card-body p,.guide-card-body li { margin: 0; color: #536178; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.guide-card-body h4 { margin: 5px 0 0; color: #293a30; font-size: 13px; }
.guide-card-body ol { display: grid; gap: 5px; margin: 0; padding-left: 20px; }
.guide-card-body code { padding: 2px 4px; border-radius: 3px; background: #f1f0e9; color: #293a30; overflow-wrap: anywhere; }
.guide-card-body p.guide-related { padding-top: 8px; border-top: 1px solid #eceae2; }
.information-page [hidden] { display: none !important; }
.policy-page { display: grid; grid-template-columns: minmax(0, 1fr) 280px; align-items: start; gap: 22px; padding-bottom: 80px; }
.policy-content { min-width: 0; padding: clamp(20px, 4vw, 42px); color: #536178; font-size: 14px; line-height: 1.8; }
.policy-content h2 { margin: 36px 0 12px; color: #293a30; font-size: clamp(20px, 2.4vw, 26px); scroll-margin-top: 25px; }
.policy-content h2:first-of-type { margin-top: 30px; }
.policy-content p,.policy-content li { max-width: 84ch; }
.policy-content li { margin: 7px 0; }
.policy-content a { color: #31574b; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.policy-dates { padding-bottom: 12px; border-bottom: 1px solid #e5e2d8; color: #69736b; font-size: 12px; }
.policy-summary { color: #293a30; font-size: 15px; }
.policy-toc { margin: 24px 0 30px; padding: 20px; border: 1px solid #dedbd1; border-radius: 4px; background: #f8f7f1; }
.policy-toc h2,.policy-related h2 { margin: 0 0 10px; font-size: 17px; }
.policy-toc ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 20px; margin: 0; padding-left: 20px; font-size: 12px; }
.policy-related { margin-top: 36px; padding-top: 22px; border-top: 1px solid #e5e2d8; }
.policy-related ul { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0; padding-left: 18px; }
.policy-aside { position: sticky; top: 20px; padding: 22px; }
.policy-aside p { font-size: 12px; line-height: 1.7; }
.policy-aside .text-link { display: block; margin-top: 13px; }
.contact-related { display: flex; flex-wrap: wrap; gap: 10px; }
.developer-attribution { border-left: 3px solid #31574b; }
.mailbox-checklist { display: grid; gap: 9px; margin: 16px 0; padding-left: 20px; color: #536178; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
@media (max-width: 860px) {
  .policy-page { grid-template-columns: 1fr; }
  .policy-aside { position: static; }
}
@media (max-width: 620px) {
  .guide-toolbar { align-items: stretch; flex-direction: column; }
  .guide-toolbar .search-field { max-width: none; }
  .policy-toc ol { grid-template-columns: 1fr; }
  .guide-card-header,.guide-card-body { padding-inline: 15px; }
}