@font-face{font-family:'IRANYekanX';src:url(/wordpress/wp-content/themes/booklio/assets/fonts/IRANYekanXVF.woff2) format('woff2'),url(/wordpress/wp-content/themes/booklio/assets/fonts/IRANYekanXVF.woff) format('woff'),url(/wordpress/wp-content/themes/booklio/assets/fonts/IRANYekanXVF.ttf) format('truetype');font-weight:100 1000;font-style:normal;font-display:swap}:root {
  --font: 'IRANYekanX', 'Vazirmatn', 'Segoe UI', Tahoma, Arial, sans-serif;
  --background: #fafafa;
  --foreground: #0a0a0a;
  --card: #fff;
  --secondary: #f4f4f5;
  --muted: #f4f4f5;
  --muted-foreground: #5f5f5f;
  --border: #e5e5e5;
  --radius: 12px;
  --site-max-width: 1400px;
  --site-pad-x: clamp(1.5rem, 4vw, 2.5rem);
  --header-height: 84px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: var(--font); direction: rtl; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
button, input, textarea, select { font-family: inherit; }
.site-shell { width: min(100%, var(--site-max-width)); margin-inline: auto; padding-inline: var(--site-pad-x); }
.site-main { min-height: 70vh; padding-top: var(--header-height); }
.site-header { position: fixed; z-index: 1000; top: 0; inset-inline: 0; background: rgba(255,255,255,.88); color: var(--foreground); backdrop-filter: blur(24px) saturate(150%); border-bottom: 1px solid rgba(229,229,229,.8); transition: box-shadow .25s ease, border-color .25s ease; }
.site-header.is-scrolled { box-shadow: 0 14px 35px rgba(0,0,0,.055); border-bottom-color: var(--border); }
.site-header__inner { min-height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.brand { display: inline-flex; align-items: center; gap: .5rem; }
.brand img { height: 2.4rem; width: auto; }
.site-nav ul, .footer-menu { list-style: none; margin: 0; padding: 0; }
.site-nav ul { display: flex; align-items: center; gap: .5rem; }
.site-nav a { display: inline-flex; align-items: center; min-height: 40px; padding: .5rem 1rem; border-radius: 10px; color: rgba(10,10,10,.75); font-size: .9375rem; font-weight: 650; transition: background .2s ease, color .2s ease; }
.site-nav a:hover, .site-nav .current-menu-item > a { color: var(--foreground); background: rgba(244,244,245,.85); }
.header-actions { display: flex; align-items: center; gap: .5rem; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 42px; padding: .75rem 1.1rem; border-radius: 10px; border: 1px solid var(--border); background: #fff; color: var(--foreground); font-size: .9375rem; font-weight: 700; transition: transform .15s ease, opacity .2s ease, background .2s ease; cursor: pointer; }
.btn:hover { transform: translateY(-1px); background: var(--secondary); }
.btn--primary { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
.btn--primary:hover { background: var(--foreground); opacity: .9; }
.mobile-toggle { display: none; width: 42px; height: 42px; border: 1px solid var(--border); background: #fff; border-radius: 10px; font-size: 22px; }
.hero { position: relative; overflow: hidden; padding: 4.5rem 0 8rem; }
.hero--compact { padding: 4.5rem 0 5rem; }
.hero__pattern { position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(circle at 2px 2px, rgba(0,0,0,.18) 1px, transparent 1px); background-size: 22px 22px; mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent); -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent); }
.hero__inner { position: relative; z-index: 1; text-align: center; }
.hero h1 { margin: 0 0 1.5rem; font-size: clamp(2.7rem, 5vw, 3.9rem); line-height: 1.14; letter-spacing: -.035em; font-weight: 850; }
.hero p { margin: 0 auto; max-width: 760px; color: var(--muted-foreground); font-size: clamp(1rem, 1.5vw, 1.25rem); line-height: 1.75; }
.section { padding: clamp(3.5rem, 7vw, 6.5rem) 0; }
.section--white { background: #fff; }
.section-head { max-width: 840px; margin-bottom: 2.5rem; }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head h2 { margin: 0 0 1rem; font-size: clamp(2.15rem, 4vw, 3.6rem); line-height: 1.18; letter-spacing: -.03em; }
.section-head p { margin: 0; color: var(--muted-foreground); font-size: 1.08rem; line-height: 1.8; }
.grid { display: grid; gap: 1.5rem; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card { background: var(--card); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.card:hover { border-color: rgba(10,10,10,.2); transform: translateY(-2px); box-shadow: 0 18px 45px rgba(0,0,0,.06); }
.card__body { padding: 1.5rem; }
.card h2, .card h3 { margin: 0 0 .75rem; line-height: 1.45; }
.card p { color: var(--muted-foreground); line-height: 1.75; margin: 0; }
.card__media { aspect-ratio: 16 / 10; background: var(--secondary); overflow: hidden; }
.card__media img { width: 100%; height: 100%; object-fit: cover; }
.meta-row { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; color: var(--muted-foreground); font-size: .82rem; margin-bottom: .85rem; }
.content-wrap { max-width: 900px; margin-inline: auto; }
.wp-content { font-size: 1.0625rem; line-height: 2; color: rgba(10,10,10,.9); }
.wp-content h2 { font-size: 2rem; margin: 2.4rem 0 1rem; line-height: 1.35; }
.wp-content h3 { font-size: 1.45rem; margin: 2rem 0 .75rem; }
.wp-content p { margin: 0 0 1.35rem; }
.wp-content ul, .wp-content ol { padding-right: 1.4rem; }
.docs-layout { display: grid; grid-template-columns: 320px minmax(0,1fr); gap: 2rem; align-items: start; }
.docs-sidebar { position: sticky; top: 110px; }
.docs-sidebar__search { width: 100%; border: 1px solid var(--border); border-radius: 10px; padding: .9rem 1rem; margin-bottom: 1.25rem; }
.docs-menu { list-style: none; padding: 0; margin: 0; display: grid; gap: .9rem; }
.docs-menu a { display: block; color: var(--muted-foreground); font-size: .92rem; padding: .25rem 0; }
.docs-menu a:hover, .docs-menu .is-active { color: var(--foreground); font-weight: 700; }
.cta { position: relative; overflow: hidden; background: #0a0a0a; color: #fafafa; border-radius: 24px; padding: clamp(2rem, 5vw, 4rem); }
.cta::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
.cta > * { position: relative; z-index: 1; }
.cta p { color: rgba(250,250,250,.65); }
.site-footer { background: #0a0a0a; color: #fff; border-top: 1px solid rgba(250,250,250,.1); }
.site-footer__pattern { position: relative; overflow: hidden; border-bottom: 1px solid rgba(250,250,250,.1); }
.site-footer__pattern::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 24px 24px; }
.site-footer__inner { position: relative; padding: 4rem 0 1.5rem; }
.site-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 3rem; padding-bottom: 2rem; }
.site-footer h4 { margin: 0 0 1.25rem; font-size: .75rem; color: rgba(250,250,250,.35); letter-spacing: .1em; }
.site-footer p, .site-footer a { color: rgba(255,255,255,.72); font-size: .85rem; line-height: 1.75; }
.site-footer a:hover { color: #fff; }
.footer-menu { display: grid; gap: .55rem; }
.enamad { display: flex; align-items: flex-start; margin-top: 1.5rem; }
.enamad img { max-height: 90px; width: auto; }
.social-row { border-top: 1px solid rgba(255,255,255,.1); padding-top: 1rem; display: flex; flex-direction: column; align-items: center; gap: 1rem; color: rgba(255,255,255,.45); }

.back-to-top {
  position: fixed;
  left: 1.5rem;
  bottom: 1.5rem;
  z-index: 900;
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: var(--foreground);
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
  backdrop-filter: blur(18px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(.75rem);
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease, background .2s ease;
  cursor: pointer;
}
.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.back-to-top:hover {
  background: #fff;
}
.back-to-top__icon {
  width: 1.1rem;
  height: 1.1rem;
}
.social-links { display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap; }
.pagination { display: flex; justify-content: center; gap: .5rem; margin-top: 3rem; }
.pagination .page-numbers { min-width: 40px; min-height: 40px; border: 1px solid var(--border); border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; padding: 0 .8rem; background: #fff; }
.pagination .current { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
@media (max-width: 1024px) { .grid--3, .grid--4 { grid-template-columns: repeat(2, minmax(0,1fr)); } .docs-layout { grid-template-columns: 1fr; } .docs-sidebar { position: static; } .site-footer__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .site-nav, .header-actions { display: none; } .mobile-toggle { display: inline-flex; align-items: center; justify-content: center; } .site-header.is-open .site-nav { display: block; position: absolute; top: 100%; inset-inline: 0; background: rgba(255,255,255,.98); border-bottom: 1px solid var(--border); padding: 1rem var(--site-pad-x); } .site-header.is-open .site-nav ul { display: grid; gap: .25rem; } }
@media (max-width: 720px) { .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; } .hero { padding: 3.5rem 0 5.5rem; } .site-footer__grid { grid-template-columns: 1fr; } .brand img { height: 2rem; } }
.card.is-featured { border-color: rgba(10,10,10,.45); box-shadow: 0 22px 60px rgba(0,0,0,.08); }
.pricing-table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; min-width: 720px; }
.pricing-table th, .pricing-table td { padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); text-align: center; white-space: nowrap; }
.pricing-table th:first-child, .pricing-table td:first-child { text-align: right; }
.pricing-table thead th { font-weight: 850; background: rgba(244,244,245,.65); position: sticky; top: var(--header-height); z-index: 3; }
.pricing-table tbody tr:hover td { background: rgba(0,0,0,.045); }
.pricing-table tr:last-child td { border-bottom: 0; }
.pricing-table__group td { background: #d8d8d8; color: #111; font-weight: 800; text-align: right !important; }
.wp-block-button__link { border-radius: 10px; font-weight: 800; background: var(--foreground); color: var(--background); padding: .85rem 1.15rem; }
.wp-block-quote { border-right: 3px solid var(--foreground); margin: 2rem 0; padding: .75rem 1.25rem; background: var(--secondary); border-radius: 12px; }
.wp-block-table table { width: 100%; border-collapse: collapse; }
.wp-block-table td, .wp-block-table th { border: 1px solid var(--border); padding: .85rem 1rem; }
.search-form { display: flex; gap: .75rem; align-items: center; }
.search-form label { flex: 1; }
.search-field { width: 100%; border: 1px solid var(--border); border-radius: 10px; padding: .9rem 1rem; background: #fff; }
.search-submit { min-height: 44px; border: 1px solid var(--foreground); background: var(--foreground); color: var(--background); border-radius: 10px; padding: 0 1.25rem; font-weight: 800; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.alignwide { max-width: 1200px; margin-inline: auto; }
.alignfull { width: 100vw; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); }
@media (max-width: 720px) { .search-form { flex-direction: column; align-items: stretch; } .pricing-table th, .pricing-table td { padding-inline: 1rem; } }
.workflow-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }
.workflow-card { position: relative; background: #fff; border-radius: 18px; padding: 1.4rem; min-height: 190px; display: flex; flex-direction: column; align-items: flex-start; text-align: right; }
.workflow-card:not(:last-child)::after { content: ''; position: absolute; top: 2.1rem; left: -1rem; width: 1rem; height: 1px; background: var(--border); }
.workflow-card span { width: 38px; height: 38px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: rgba(10,10,10,.08); color: var(--foreground); font-weight: 850; margin-bottom: 1rem; }
.workflow-card h3 { margin: 0 0 .6rem; font-size: 1.05rem; }
.workflow-card p { margin: 0; color: var(--muted-foreground); line-height: 1.75; font-size: .9rem; }
.faq-list { max-width: 900px; margin-inline: auto; display: grid; gap: .75rem; }
.faq-item { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 1.1rem 1.25rem; }
.faq-item summary { cursor: pointer; font-weight: 800; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item p { margin: 1rem 0 0; color: var(--muted-foreground); line-height: 1.85; }
.hero .card__media { box-shadow: 0 28px 80px rgba(0,0,0,.08); }
@media (max-width: 1180px) { .workflow-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .workflow-card::after { display: none; } }
@media (max-width: 760px) { .workflow-grid { grid-template-columns: 1fr; } .single-booklio_use_case .hero .site-shell { grid-template-columns: 1fr !important; } }
.docs-menu > li { border-bottom: 1px solid var(--border); padding-bottom: .75rem; }
.docs-menu > li:last-child { border-bottom: 0; }
.docs-menu__section { font-size: 1rem !important; font-weight: 850; color: var(--foreground) !important; }
.docs-menu ul { list-style: none; padding: .5rem 0 0; margin: 0; display: grid; gap: .25rem; }
.docs-menu ul a { font-size: .86rem; line-height: 1.7; }
.breadcrumbs { margin: 0 auto 1.5rem; display: inline-flex; max-width: 100%; }
.breadcrumbs ol { list-style: none; display: flex; align-items: center; justify-content: center; gap: .45rem; flex-wrap: wrap; margin: 0; padding: .35rem .75rem; border: 1px solid var(--border); border-radius: 999px; background: rgba(255,255,255,.7); backdrop-filter: blur(10px); }
.breadcrumbs li { display: inline-flex; align-items: center; gap: .45rem; color: var(--muted-foreground); font-size: .78rem; }
.breadcrumbs li:not(:last-child)::after { content: ''; width: .8rem; height: .8rem; flex: 0 0 auto; margin-inline: .02rem; background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M14 8H4' stroke='rgba(95,95,95,0.52)' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='M8 12 4 8l4-4' stroke='rgba(95,95,95,0.52)' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.breadcrumbs a { color: rgba(10,10,10,.65); }
.breadcrumbs a:hover { color: var(--foreground); }
.breadcrumbs span { color: var(--foreground); }
.hero__inner .breadcrumbs + h1 { margin-top: 0; }
.feature-section-list { display: grid; gap: 1.25rem; }
.feature-section-card { display: grid; grid-template-columns: minmax(260px,.9fr) minmax(0,1.1fr); gap: 2rem; align-items: start; background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 1.5rem; }
.feature-section-card h2 { margin: 0 0 .75rem; font-size: 1.55rem; }
.feature-section-card p { margin: 0; color: var(--muted-foreground); line-height: 1.8; }
.feature-section-card ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .75rem; }
.feature-section-card li { background: var(--secondary); border-radius: 12px; padding: .85rem 1rem; font-weight: 700; color: rgba(10,10,10,.8); }
@media (max-width: 820px) { .feature-section-card { grid-template-columns: 1fr; } .feature-section-card ul { grid-template-columns: 1fr; } }
.pricing-card { position: relative; }
.plan-badge { display: inline-flex; margin-bottom: .85rem; border-radius: 999px; background: var(--foreground); color: var(--background); padding: .3rem .75rem; font-size: .78rem; font-weight: 850; }
.plan-price { font-size: 1.8rem !important; color: var(--foreground) !important; font-weight: 900 !important; margin-bottom: .85rem !important; }
.pricing-card .wp-content { margin: 1rem 0 1.4rem; font-size: .95rem; }
.pricing-card .wp-content ul { margin: 0; padding-right: 1.1rem; }
.pricing-table-wrap { margin-top: 2rem; overflow-x: auto; scrollbar-gutter: stable; }
.home-hero { position: relative; overflow: hidden; background: var(--background); padding: clamp(4rem, 8vw, 7rem) 0 6rem; }
.home-hero__grid { position: absolute; inset: 0; background-image: linear-gradient(to right, rgba(0,0,0,.055) 1px, transparent 1px), linear-gradient(to bottom, rgba(0,0,0,.055) 1px, transparent 1px); background-size: 40px 40px; opacity: .65; }
.home-hero__glow { position: absolute; inset: 0; background: radial-gradient(ellipse 75% 55% at 50% 12%, rgba(255,255,255,.9) 0%, transparent 72%); }
.home-hero::after { content: ''; position: absolute; inset-inline: 0; bottom: 0; height: 10rem; background: linear-gradient(to top, var(--background), transparent); }
.home-hero__inner { position: relative; z-index: 1; }
.home-hero__tag { display: flex; justify-content: center; margin-bottom: 2rem; }
.home-hero__tag span { display: inline-flex; border: 1px solid var(--border); border-radius: 999px; padding: .4rem .8rem; background: rgba(255,255,255,.65); color: var(--muted-foreground); font-size: .75rem; font-weight: 750; backdrop-filter: blur(10px); }
.home-hero__copy { max-width: 860px; margin-inline: auto; text-align: center; }
.home-hero__copy h1 { margin: 0 0 1.5rem; white-space: pre-line; font-size: clamp(2.8rem, 5vw, 4rem); line-height: 1.3; letter-spacing: -.045em; font-weight: 950; }
.home-hero__typed-title {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: .22em;
}

.home-hero__typed-prefix {
    display: inline-block;
}

.home-hero__typed-word-wrap {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-start;
    min-width: 8ch;
}

.home-hero__typed-word {
    display: inline-block;
    color: rgba(10, 10, 10, .82);
}

.home-hero__typed-caret {
    display: inline-block;
    width: .08em;
    height: .92em;
    margin-inline-start: .12em;
    border-radius: 999px;
    background: currentColor;
    transform: translateY(.08em);
    animation: booklioHeroTypedCaret 1s steps(1, end) infinite;
}

@keyframes booklioHeroTypedCaret {
    0%, 48% { opacity: 1; }
    49%, 100% { opacity: 0; }
}

.home-hero__copy p { max-width: 720px; margin: 0 auto; color: var(--muted-foreground); font-size: clamp(1.05rem, 1.7vw, 1.25rem); line-height: 1.85; }
.home-hero__actions { margin-top: 2.5rem; display: flex; justify-content: center; gap: .75rem; flex-wrap: wrap; }
.home-marquee { position: relative; overflow: hidden; margin: 3.5rem 0; direction: ltr; mask-image: linear-gradient(to right, transparent, #000 16%, #000 84%, transparent); -webkit-mask-image: linear-gradient(to right, transparent, #000 16%, #000 84%, transparent); }
.home-marquee__track { display: inline-flex; gap: .75rem; min-width: max-content; animation: booklio-marquee 56s linear infinite; }
.home-marquee span { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; border: 1px solid var(--border); border-radius: 999px; background: rgba(255,255,255,.8); padding: .45rem 1rem; color: rgba(10,10,10,.72); font-weight: 750; direction: rtl; white-space: nowrap; }
@keyframes booklio-marquee { from { transform: translateX(0); } to { transform: translateX(-33.333%); } }
.hero-screen { max-width: 1200px; margin-inline: auto; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; background: rgba(255,255,255,.9); box-shadow: 0 24px 70px rgba(0,0,0,.08); backdrop-filter: blur(8px); }
.home-audit-modal[hidden] { display: none; }
.home-audit-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    align-items: center;
    justify-items: center;
    padding: clamp(1rem, 3vh, 2rem) .75rem;
    padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right));
    box-sizing: border-box;
    overflow-x: hidden;
}

.home-audit-modal__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(15, 23, 42, .55);
    backdrop-filter: blur(10px) saturate(135%);
    cursor: pointer;
    opacity: 0;
    transition: opacity .36s ease;
}

.home-audit-modal__dialog {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    width: min(540px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - clamp(2rem, 8vh, 4.5rem));
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .9);
    border-radius: 24px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 32px 80px rgba(15, 23, 42, .28), 0 2px 12px rgba(15, 23, 42, .08);
    opacity: 0;
    transform: translateY(38px) scale(.94);
    transform-origin: top center;
    transition: opacity .36s ease, transform .44s cubic-bezier(.16, 1, .3, 1);
    will-change: opacity, transform;
    box-sizing: border-box;
}

.home-audit-modal[data-state="open"] .home-audit-modal__backdrop {
    opacity: 1;
}

.home-audit-modal[data-state="open"] .home-audit-modal__dialog {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.home-audit-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.15rem 1.15rem 1rem;
    border-bottom: 1px solid rgba(226, 232, 240, .95);
    background: linear-gradient(180deg, rgba(248, 250, 252, .98), rgba(255, 255, 255, .98));
}

.home-audit-modal__header strong {
    display: block;
    font-size: 1.08rem;
    line-height: 1.55;
    font-weight: 900;
    letter-spacing: -.01em;
}

.home-audit-modal__header p {
    margin: .32rem 0 0;
    color: rgba(15, 23, 42, .62);
    font-size: .88rem;
    line-height: 1.8;
}

.home-audit-modal__close {
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 10px;
    background: #fff;
    color: var(--foreground);
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    flex: 0 0 auto;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

.home-audit-modal__close:hover {
    background: rgba(248, 250, 252, 1);
    border-color: rgba(203, 213, 225, 1);
    transform: translateY(-1px);
}

.home-audit-modal__close .booklio-lucide {
    width: 1rem;
    height: 1rem;
    stroke-width: 2.2;
}

.home-audit-modal__body {
    padding: 1.1rem 1.15rem 1.2rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(148, 163, 184, .78) transparent;
    scrollbar-gutter: stable;
}

.home-audit-modal__status {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    border: 1px dashed rgba(203, 213, 225, .9);
    border-radius: 18px;
    background: rgba(248, 250, 252, .85);
    color: rgba(15, 23, 42, .68);
    font-size: .94rem;
    line-height: 1.9;
    text-align: center;
    padding: 1rem 1.1rem;
}

.home-audit-modal__status[hidden] {
    display: none !important;
}

.home-audit-modal__status.is-error {
    border-color: rgba(248, 113, 113, .38);
    background: rgba(254, 242, 242, .95);
    color: rgba(153, 27, 27, .92);
}

.home-audit-modal.is-loading [data-home-audit-form-host]:empty {
    display: none;
}

.home-audit-modal__body::-webkit-scrollbar {
    width: 12px;
}

.home-audit-modal__body::-webkit-scrollbar-track {
    background: transparent;
}

.home-audit-modal__body::-webkit-scrollbar-thumb {
    border: 3px solid transparent;
    border-radius: 999px;
    background: rgba(148, 163, 184, .78);
    background-clip: padding-box;
}

.home-audit-modal__body::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 116, 139, .88);
    background-clip: padding-box;
}

html.has-home-audit-modal,
html.has-home-audit-modal body {
    overflow: hidden;
}

@media (max-width: 760px) {
    .home-audit-modal {
        padding: 16px;
    }

    .home-audit-modal__dialog {
        width: min(540px, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
        max-height: calc(100dvh - 32px);
        border-radius: 24px;
    }

    .home-audit-modal__header,
    .home-audit-modal__body {
        padding-inline: .95rem;
    }

    .home-audit-modal__header {
        padding-top: 1rem;
    }

    .home-audit-modal__header strong {
        font-size: 1rem;
    }
}
.hero-screen__bar { display: flex; align-items: center; gap: .4rem; padding: .9rem 1rem; border-bottom: 1px solid var(--border); background: rgba(244,244,245,.7); }
.hero-screen__bar span { width: 12px; height: 12px; border-radius: 999px; background: #d8d8d8; }
.hero-screen__bar div { flex: 1; height: 24px; margin-inline-start: 2rem; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.hero-screen__image { aspect-ratio: 16 / 9; position: relative; overflow: hidden; background: #fff; }
.hero-screen__image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.trust-strip { background: #fff; border-block: 1px solid var(--border); }
.trust-strip__grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px; }
.trust-strip__grid div { padding: 1.6rem 1rem; text-align: center; }
.trust-strip strong { display: block; font-size: 1.35rem; font-weight: 900; margin-bottom: .25rem; }
.trust-strip span { color: var(--muted-foreground); font-size: .9rem; }
.problem-section { background: var(--background); }
.problem-grid { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 3rem; align-items: center; }
.problem-cards { display: grid; gap: 1rem; }
.feature-tiles-section { border-top: 1px solid var(--border); }
.feature-tile-rows { display: grid; gap: 1.5rem; }
.feature-tile-row { display: grid; gap: 1.5rem; align-items: stretch; }
.feature-tile-row--3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.feature-tile-row--2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.feature-tile { min-height: 100%; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #e2e8f0; border-radius: 1.5rem; background: rgba(255,255,255,.96); }
.feature-tile__body { padding: 1.35rem 1.5rem; }
.feature-tile__body h3 { margin: 0; font-size: 1.05rem; font-weight: 850; }
.feature-tile__body p { margin: .75rem 0 0; color: var(--muted-foreground); line-height: 1.75; }
.feature-tile__image { margin-top: auto; background: linear-gradient(135deg, rgba(226,232,240,.75), rgba(255,255,255,1)); }
.feature-tile__image img { width: 100%; height: 220px; object-fit: cover; }
.center-action { margin-top: 3rem; display: flex; justify-content: center; }
.usecase-section { border-top: 1px solid var(--border); }
.usecase-section .card__media { height: 250px; background: #fff; }
.usecase-section .card__media img { object-fit: contain; padding: .4rem; }
.integration-grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 3rem; align-items: center; }
.integration-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.integration-cards div { min-height: 160px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 18px; background: #fff; font-size: 1.2rem; font-weight: 900; }
.guided-box { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 3rem; align-items: start; border: 1px solid var(--border); border-radius: 24px; background: #fff; padding: clamp(1.5rem, 4vw, 3rem); }
.guided-box ol { margin: 0; padding: 0; list-style: none; counter-reset: guided; display: grid; gap: .85rem; }
.guided-box li { counter-increment: guided; display: flex; gap: .85rem; align-items: center; border-radius: 14px; background: var(--secondary); padding: 1rem; font-weight: 750; }
.guided-box li::before { content: counter(guided); width: 34px; height: 34px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: rgba(10,10,10,.08); font-weight: 950; }
.purchase-notes { max-width: 1200px; margin: 3rem auto 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; text-align: center; }
.purchase-notes div { padding: 1.25rem; border-radius: 16px; }
.purchase-notes strong { display: block; margin-bottom: .45rem; font-weight: 850; }
.purchase-notes span { color: var(--muted-foreground); font-size: .88rem; line-height: 1.7; }
@media (max-width: 1024px) { .problem-grid, .integration-grid, .guided-box { grid-template-columns: 1fr; } .feature-tile-row--3, .feature-tile-row--2 { grid-template-columns: repeat(2,minmax(0,1fr)); } .purchase-notes, .trust-strip__grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 680px) { .home-hero__actions .btn { width: 100%; } .feature-tile-row--3, .feature-tile-row--2, .integration-cards, .purchase-notes, .trust-strip__grid { grid-template-columns: 1fr; } .hero-screen__bar div { margin-inline-start: .75rem; } }
.features-anchor-nav { position: sticky; top: var(--header-height); z-index: 40; background: rgba(250,250,250,.95); border-block: 1px solid var(--border); backdrop-filter: blur(12px); }
.features-anchor-nav .site-shell { display: flex; justify-content: center; gap: .45rem; overflow-x: auto; padding-block: .75rem; scrollbar-width: none; }
.features-anchor-nav .site-shell::-webkit-scrollbar { display: none; }
.features-anchor-nav a { white-space: nowrap; border-radius: 999px; padding: .55rem .9rem; color: rgba(10,10,10,.68); font-size: .9rem; font-weight: 800; transition: background .2s ease, color .2s ease; }
.features-anchor-nav a:hover { background: var(--secondary); color: var(--foreground); }
.feature-detail-section { scroll-margin-top: 140px; }
.feature-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; }
.feature-checklist { margin-top: 2rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.feature-checklist span { display: inline-flex; align-items: center; gap: .4rem; border: 1px solid var(--border); background: #fff; border-radius: 999px; padding: .65rem 1rem; font-size: .9rem; font-weight: 750; color: rgba(10,10,10,.75); }
.feature-checklist span::before { content: '✓'; font-weight: 900; color: var(--foreground); }
@media (max-width: 1024px) { .feature-detail-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .features-anchor-nav .site-shell { justify-content: flex-start; } }
@media (max-width: 680px) {
  .features-anchor-nav { overflow: hidden; }
  .features-anchor-nav .site-shell {
    justify-content: flex-start;
    padding-inline: var(--site-pad-x);
    scroll-padding-inline: var(--site-pad-x);
    -webkit-overflow-scrolling: touch;
  }
  .features-anchor-nav a {
    flex: 0 0 auto;
    padding-inline: .82rem;
    font-size: .84rem;
  }
  .feature-detail-grid { grid-template-columns: 1fr; }
}
.plans-section .pricing-card, .page-template-template-plans .pricing-card { border-radius: 18px; background: var(--background); }
.page-template-template-plans .pricing-card .card__body { padding: clamp(1.6rem, 3vw, 2.5rem); }
.page-template-template-plans .pricing-card h2 { font-size: 1.55rem; margin-bottom: .6rem; }
.page-template-template-plans .pricing-card .btn { width: 100%; margin-top: 1rem; }
.page-template-template-plans .pricing-table thead th { top: calc(var(--header-height) + 0px); box-shadow: 0 8px 18px rgba(0,0,0,.045); }
.page-template-template-plans .pricing-table td:nth-child(n+2), .page-template-template-plans .pricing-table th:nth-child(n+2) { min-width: 140px; }
.page-template-template-plans .pricing-table td:first-child { min-width: 260px; color: rgba(10,10,10,.86); font-weight: 700; }
.page-template-template-plans .pricing-table td { color: rgba(10,10,10,.78); }
.page-template-template-plans .pricing-table td { font-size: .93rem; }
.use-cases-archive .section-head { margin-bottom: 3.25rem; }
.use-cases-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; align-items: stretch; }
.use-cases-grid .card { height: 100%; display: flex; flex-direction: column; }
.use-cases-grid .card__media { height: 250px; background: #fff; border-bottom: 1px solid var(--border); }
.use-cases-grid .card__media img { width: 100%; height: 100%; object-fit: contain; padding: .35rem; }
.use-cases-grid .card__body { flex: 1; display: flex; flex-direction: column; }
.use-cases-grid .card__body h2 { font-size: 1.15rem; }
.use-case-hero { position: relative; overflow: hidden; padding: 4.5rem 0 clamp(3rem, 6vw, 5rem); background: #fff; border-bottom: 1px solid var(--border); }
.use-case-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(244,244,245,.9), transparent 72%); pointer-events: none; }
.use-case-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, 540px); gap: clamp(2rem, 5vw, 4rem); align-items: end; }
.use-case-hero__copy { padding-bottom: 1rem; }
.use-case-back { display: inline-flex; margin-bottom: 1.1rem; color: var(--muted-foreground); font-size: .9rem; font-weight: 800; }
.use-case-back:hover { color: var(--foreground); }
.use-case-hero h1 { margin: 0 0 1.25rem; font-size: clamp(2.6rem, 5vw, 4rem); line-height: 1.18; letter-spacing: -.04em; font-weight: 950; }
.use-case-hero p { margin: 0; max-width: 680px; color: var(--muted-foreground); font-size: 1.13rem; line-height: 1.85; }
.use-case-hero__actions { margin-top: 2rem; display: flex; gap: .75rem; flex-wrap: wrap; }
.use-case-hero__visual { min-height: 380px; display: flex; align-items: flex-end; justify-content: center; border-radius: 24px; overflow: hidden; background: var(--secondary); box-shadow: 0 24px 70px rgba(0,0,0,.08); }
.use-case-hero__visual img { width: 100%; height: 100%; min-height: 380px; object-fit: cover; }
.use-case-problem-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 3rem; align-items: center; }
.use-case-content-grid { display: grid; grid-template-columns: minmax(320px, .85fr) minmax(0, 1.15fr); gap: 3rem; align-items: stretch; }
.use-case-content-media { border-radius: 24px; overflow: hidden; background: var(--secondary); min-height: 100%; }
.use-case-content-media img { width: 100%; height: 100%; object-fit: cover; }
.related-use-cases .section-head { margin-bottom: 2rem; }
@media (max-width: 1080px) { .use-cases-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .use-case-hero__grid, .use-case-problem-grid, .use-case-content-grid { grid-template-columns: 1fr; } .use-case-content-media { max-height: 420px; } }
@media (max-width: 680px) { .use-cases-grid { grid-template-columns: 1fr; } .use-case-hero__actions .btn { width: 100%; } .use-case-hero__visual, .use-case-hero__visual img { min-height: 280px; } }

/* Blog archive and post templates */
.blog-layout { display: grid; grid-template-columns: 310px minmax(0, 1fr); gap: 2rem; align-items: start; }
.blog-sidebar { position: sticky; top: calc(var(--header-height) + 1.5rem); display: grid; gap: 1.5rem; }
.blog-search, .docs-home-search { position: relative; }
.blog-search input, .docs-home-search input { width: 100%; min-height: 52px; border: 1px solid var(--border); border-radius: 14px; background: #fff; padding: 0 1rem 0 3.2rem; color: var(--foreground); font-size: .95rem; outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
.blog-search input:focus, .docs-home-search input:focus { border-color: rgba(10,10,10,.35); box-shadow: 0 0 0 4px rgba(10,10,10,.045); }
.blog-search button, .docs-home-search button { position: absolute; left: .45rem; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; border: 0; border-radius: 11px; background: var(--foreground); color: var(--background); font-size: 1.1rem; cursor: pointer; }
.blog-filter-block { border-top: 1px solid var(--border); padding-top: 1.25rem; }
.blog-filter-block h2 { margin: 0 0 1rem; font-size: 1rem; font-weight: 850; }
.blog-filter-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
.blog-filter-list a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 40px; border-radius: 10px; color: rgba(10,10,10,.72); font-size: .92rem; transition: background .2s ease, color .2s ease; }
.blog-filter-list a:hover { color: var(--foreground); background: var(--secondary); padding-inline: .65rem; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: .5rem; }
.tag-cloud a, .blog-share-row__tags a { display: inline-flex; align-items: center; min-height: 34px; border: 1px solid var(--border); border-radius: 999px; background: #fff; padding: .35rem .75rem; color: rgba(10,10,10,.68); font-size: .82rem; font-weight: 700; }
.blog-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: stretch; }
.post-card { height: 100%; display: flex; flex-direction: column; }
.post-card__media { height: 245px; }
.post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: none; }
.post-card__body { flex: 1; display: flex; flex-direction: column; }
.post-card__body h2 { font-size: 1.2rem; margin-bottom: .7rem; }
.post-card__body h2 a:hover { color: rgba(10,10,10,.68); }
.post-card__body p { margin-top: auto; }
.post-card__category::before { content: '▦'; margin-left: .35rem; color: rgba(10,10,10,.45); }
.empty-state { min-height: 360px; border: 1px dashed var(--border); border-radius: 18px; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: .75rem; padding: 2rem; }
.empty-state::before { content: '⌕'; width: 56px; height: 56px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--secondary); color: rgba(10,10,10,.4); font-size: 1.5rem; }
.empty-state strong { font-size: 1.15rem; }
.empty-state p { margin: 0; color: var(--muted-foreground); }
.blog-single { padding-top: clamp(3rem, 6vw, 5rem); }
.blog-single__shell { max-width: 980px; }
.blog-article__media { margin: 0 0 2.5rem; border-radius: 24px; overflow: hidden; background: var(--secondary); box-shadow: 0 24px 70px rgba(0,0,0,.07); }
.blog-article__media img { width: 100%; max-height: 540px; object-fit: cover; }
.blog-article__header { max-width: 860px; margin: 0 auto 2rem; text-align: center; }
.blog-article__category { display: inline-flex; margin-bottom: 1rem; border: 1px solid var(--border); border-radius: 999px; background: #fff; padding: .38rem .8rem; color: rgba(10,10,10,.65); font-size: .82rem; font-weight: 800; }
.blog-article__header h1 { margin: 0 0 1rem; font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1.2; letter-spacing: -.04em; font-weight: 950; }
.blog-article__meta { justify-content: center; margin-bottom: 0; }
.blog-article__content { max-width: 860px; margin-inline: auto; }
.blog-share-row { max-width: 860px; margin: 3rem auto 0; padding: 1.25rem 0; border-block: 1px solid var(--border); display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; }
.blog-share-row__tags, .blog-share-row__links { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.blog-share-row__links { justify-content: flex-end; }
.blog-share-row__links a { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; border-radius: 10px; border: 1px solid var(--border); background: #fff; padding: .4rem .75rem; color: rgba(10,10,10,.72); font-size: .82rem; font-weight: 800; transition: background .2s ease, color .2s ease; }
.blog-share-row__links a:hover { background: var(--foreground); color: var(--background); }
.related-posts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; max-width: 860px; }
.related-post-card a { display: flex; min-height: 112px; align-items: center; border: 1px solid var(--border); border-radius: 16px; background: #fff; padding: 1.25rem; font-size: 1.05rem; font-weight: 850; line-height: 1.6; transition: background .2s ease, border-color .2s ease; }
.related-post-card a:hover { background: var(--secondary); border-color: rgba(10,10,10,.22); }

/* Documentation center */
.docs-home-search { max-width: 720px; margin: 0 auto 3rem; }
.docs-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.docs-category-card { border: 1px solid var(--border); border-radius: 18px; background: #fff; padding: 1.5rem; min-height: 100%; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.docs-category-card:hover { transform: translateY(-2px); border-color: rgba(10,10,10,.22); box-shadow: 0 18px 45px rgba(0,0,0,.055); }
.docs-category-card h2 { margin: 0 0 .75rem; font-size: 1.25rem; }
.docs-category-card p { margin: 0 0 1rem; color: var(--muted-foreground); line-height: 1.75; }
.docs-category-card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .45rem; }
.docs-category-card li { color: rgba(10,10,10,.68); font-size: .9rem; line-height: 1.7; }
.docs-category-card li a:hover { color: var(--foreground); }
.docs-category-card__more { display: inline-flex; margin-top: 1.25rem; color: var(--foreground); font-size: .9rem; font-weight: 850; }
.docs-page-section { padding-top: clamp(5rem, 8vw, 7.5rem); }
.docs-layout { grid-template-columns: 300px minmax(0, 1fr); gap: clamp(2rem, 4vw, 4rem); }
.docs-sidebar { border-left: 1px solid var(--border); padding-left: 1.25rem; }
.docs-sidebar__form { margin-bottom: 1.4rem; }
.docs-sidebar__search { margin-bottom: 0; font-size: .92rem; }
.docs-menu { display: grid; gap: .35rem; }
.docs-menu__group { border-bottom: 1px solid var(--border); padding-bottom: .55rem; }
.docs-menu__group summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; min-height: 34px; }
.docs-menu__group summary::-webkit-details-marker { display: none; }
.docs-menu__group summary span { color: rgba(10,10,10,.45); transition: transform .2s ease; }
.docs-menu__group[open] summary span { transform: rotate(180deg); }
.docs-menu__section { color: var(--foreground) !important; font-size: .98rem !important; font-weight: 850; padding: 0 !important; }
.docs-menu ul { list-style: none; margin: .45rem 0 0; padding: 0; display: grid; gap: .18rem; }
.docs-menu ul a { display: block; border-radius: 8px; padding: .3rem 0; color: rgba(10,10,10,.58); font-size: .9rem; line-height: 1.8; transition: color .2s ease, background .2s ease; }
.docs-menu ul a:hover, .docs-menu ul a.is-active { color: var(--foreground); font-weight: 800; }
.docs-content-header { margin-bottom: 2rem; }
.docs-content-header .breadcrumbs { margin-bottom: 1.25rem; }
.docs-content-header h1 { margin: 0 0 1rem; font-size: clamp(2.1rem, 4vw, 3.4rem); line-height: 1.22; letter-spacing: -.035em; font-weight: 950; }
.docs-content-header p { margin: 0; max-width: 760px; color: var(--muted-foreground); line-height: 1.8; font-size: 1.05rem; }
.docs-article, .docs-category-listing { min-width: 0; }
.docs-list-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.docs-list-card .card__body h2 { font-size: 1.05rem; }
.docs-list-card .post-card__meta { display: none; }

@media (max-width: 1100px) {
  .blog-layout, .docs-layout { grid-template-columns: 1fr; }
  .blog-sidebar, .docs-sidebar { position: static; border-left: 0; padding-left: 0; }
  .docs-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .blog-card-grid, .related-posts-grid, .docs-category-grid, .docs-list-grid { grid-template-columns: 1fr; }
  .blog-share-row { grid-template-columns: 1fr; }
  .blog-share-row__links { justify-content: flex-start; }
  .post-card__media { height: 220px; }
}
.search-results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.search-result-card .post-card__media { height: 220px; }
.search-result-card .post-card__body h2 { font-size: 1.08rem; }
.docs-search-results .search-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 980px; margin-inline: auto; }
.docs-search-results .search-result-card .post-card__meta { display: none; }
@media (max-width: 900px) { .search-results-grid, .docs-search-results .search-results-grid { grid-template-columns: 1fr; } }
.archive-index .blog-filter-list a.is-active, .archive-index .tag-cloud a.is-active { background: var(--foreground); color: var(--background); border-color: var(--foreground); padding-inline: .65rem; }
.archive-posts-area { min-width: 0; }
.taxonomy-description { color: var(--muted-foreground); line-height: 1.8; }
.error404 .content-wrap { display: flex; justify-content: center; }

/* Legal pages and changelog */
.legal-page-section { padding-top: clamp(3rem, 6vw, 5rem); }
.legal-content { max-width: 860px; }
.legal-meta { display: inline-flex; align-items: center; gap: .55rem; margin-bottom: 2rem; border: 1px solid var(--border); border-radius: 999px; background: var(--secondary); padding: .45rem .85rem; color: rgba(10,10,10,.62); font-size: .84rem; }
.legal-meta strong { color: var(--foreground); font-weight: 850; }
.legal-content .wp-content, .changelog-single__article .wp-content { background: #fff; }
.legal-content .wp-content h2, .changelog-single__article .wp-content h2 { border-top: 1px solid var(--border); padding-top: 1.8rem; }
.changelog-archive .content-wrap { max-width: 960px; }
.changelog-timeline { position: relative; display: grid; gap: 1.5rem; }
.changelog-timeline::before { content: ''; position: absolute; top: .75rem; bottom: .75rem; right: 122px; width: 1px; background: var(--border); }
.changelog-entry { position: relative; display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 2rem; align-items: start; }
.changelog-entry::before { content: ''; position: absolute; top: 1.35rem; right: 115px; width: 15px; height: 15px; border-radius: 999px; background: var(--foreground); box-shadow: 0 0 0 6px #fff; }
.changelog-entry__date { color: rgba(10,10,10,.55); font-size: .9rem; font-weight: 800; padding-top: 1rem; line-height: 1.7; }
.changelog-entry__body { border: 1px solid var(--border); border-radius: 18px; background: #fff; padding: 1.5rem 1.6rem; }
.changelog-entry__body h2 { margin: 0 0 .75rem; font-size: 1.35rem; font-weight: 800; line-height: 1.45; }
.changelog-entry__body p { margin: 0; color: var(--muted-foreground); line-height: 1.85; }
.changelog-entry__excerpt { margin-bottom: 1rem !important; font-size: .96rem; }
.changelog-entry__content { padding-top: .25rem; font-size: .98rem; line-height: 1.9; color: rgba(10,10,10,.82); }
.changelog-entry__content h2 { margin: 1.35rem 0 .65rem; padding: 0; border: 0; font-size: 1.05rem; line-height: 1.6; }
.changelog-entry__content h3 { margin: 1.1rem 0 .55rem; font-size: 1rem; }
.changelog-entry__content ul,
.changelog-entry__content ol { display: grid; gap: .45rem; margin: .75rem 0 0; padding-right: 1.2rem; }
.changelog-entry__content li { color: rgba(10,10,10,.78); line-height: 1.85; }
.changelog-entry__content > *:last-child { margin-bottom: 0; }
.changelog-single .content-wrap { max-width: 880px; }
.changelog-single__article { margin-top: 1rem; }
@media (max-width: 720px) {
  .changelog-timeline::before, .changelog-entry::before { display: none; }
  .changelog-entry { grid-template-columns: 1fr; gap: .55rem; }
  .changelog-entry__date { padding-top: 0; }
}

/* About and legal page refinements */
.page-template-template-about .site-main .site-shell {
    max-width: 1200px;
}
.page-template-template-about .hero {
    padding-top: 4.5rem;
    padding-bottom: 8rem;
}
.page-template-template-about .hero h1 {
    max-width: 1040px;
    margin-inline: auto;
    margin-bottom: 1.5rem;
    font-size: clamp(3rem, 5vw, 3.75rem);
    line-height: 1.08;
    letter-spacing: -.035em;
    font-weight: 800;
}
.page-template-template-about .hero p {
    max-width: 760px;
    font-size: 1.25rem;
    line-height: 1.6;
}
.page-template-template-about .surface-card {
    background: var(--background);
    border: 1px solid var(--border);
    border-radius: 1rem;
    box-shadow: none;
}
.page-template-template-about .section-head.center {
    max-width: 920px;
    margin-inline: auto;
    margin-bottom: 2.5rem;
    text-align: center;
}
.page-template-template-about .section-head h2 {
    margin-bottom: 1rem;
    font-size: clamp(1.875rem, 3vw, 2.25rem);
    line-height: 1.25;
    letter-spacing: -.025em;
    font-weight: 800;
}
.page-template-template-about .section-head p {
    max-width: 860px;
    margin-inline: auto;
    font-size: 1rem;
    line-height: 1.8;
}
.page-template-template-about .grid {
    gap: 1.25rem;
}
.about-story-section {
    padding-top: 0;
    padding-bottom: 4rem;
    background: var(--background) !important;
}
.about-benchmark-section,
.about-roadmap-section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}
.about-benchmark-section {
    background: #fff !important;
}
.about-roadmap-section {
    background: var(--background) !important;
}
.about-story-section .section-head,
.about-benchmark-section .section-head,
.about-roadmap-section .section-head {
    max-width: 900px;
}
.about-value-grid,
.about-benchmark-grid,
.about-roadmap-grid {
    align-items: stretch;
}
.about-value-card,
.about-benchmark-card,
.about-roadmap-card {
    height: 100%;
}
.about-value-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 1.5rem;
}
.about-value-card__icon {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: .75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(10,10,10,.8);
    background: rgba(244,244,245,.4);
    border: 1px solid var(--border);
    margin: 0 0 1rem;
}
.about-value-card .card__body,
.about-roadmap-card .card__body {
    padding: 0;
}
.about-value-card h3 {
    margin: 0 0 .75rem;
    color: var(--foreground);
    font-size: 1.5rem;
    line-height: 1.45;
    font-weight: 650;
}
.about-value-card p {
    margin: 0;
    color: var(--muted-foreground);
    font-size: 1rem;
    line-height: 1.85;
}
.about-editable-content {
    margin-top: 3rem;
}
.about-benchmark-section,
.about-roadmap-section {
    border-top: 1px solid var(--border);
}
.about-benchmark-card {
    padding: 1.5rem;
    border-radius: 1rem;
    background: #fff;
}
.about-benchmark-card__badge {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--background);
    color: rgba(10,10,10,.78);
    padding: .25rem .75rem;
    margin-bottom: 1rem;
    font-size: .75rem;
    font-weight: 650;
}
.about-benchmark-card h3 {
    margin: 0 0 .65rem;
    font-size: 1.125rem;
    font-weight: 650;
    line-height: 1.55;
}
.about-benchmark-card p {
    margin: 0;
    font-size: .875rem;
    line-height: 1.8;
}
.about-benchmark-card__problem {
    color: var(--muted-foreground);
    margin-bottom: .75rem !important;
}
.about-benchmark-card__solution {
    color: var(--foreground);
}
.about-roadmap-card {
    padding: 1.5rem;
    border-radius: 1rem;
    background: var(--background);
}
.about-roadmap-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}
.about-roadmap-card__head span,
.about-roadmap-card__head strong {
    font-size: .9rem;
    font-weight: 650;
}
.about-roadmap-card__head span {
    color: var(--muted-foreground);
}
.about-roadmap-card ul {
    display: grid;
    gap: .75rem;
    padding: 0;
    margin: 0;
    list-style: none;
}
.about-roadmap-card li {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    color: rgba(10,10,10,.9);
    font-size: .9rem;
    line-height: 1.8;
}
.about-roadmap-card li span {
    width: .375rem;
    height: .375rem;
    margin-top: .72rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: rgba(10,10,10,.7);
}
@media (max-width: 760px) {
    .page-template-template-about .hero {
        padding-top: 4rem;
        padding-bottom: 5.5rem;
    }
    .page-template-template-about .hero h1 {
        font-size: clamp(2.35rem, 10vw, 3.1rem);
    }
    .page-template-template-about .hero p {
        font-size: 1.05rem;
    }
    .about-story-section,
    .about-benchmark-section,
    .about-roadmap-section {
        padding-block: 3.5rem;
    }
}
.legal-page-section {
    padding-top: clamp(3.5rem, 6vw, 5.5rem);
}
.legal-content {
    max-width: 880px;
}
.legal-content .wp-content {
    color: rgba(10,10,10,.72);
    line-height: 2.05;
}
.legal-content .wp-content > *:first-child {
    margin-top: 0;
}
.legal-content .wp-content h2 {
    margin-top: 2.2rem;
    margin-bottom: .85rem;
    color: var(--foreground);
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.55;
}
.legal-content .wp-content p {
    font-size: 1rem;
}

/* Contact page and Gravity Forms */
.page-template-template-contact .site-main .site-shell { max-width: 1400px; }
.page-template-template-contact .hero { padding-top: 4.5rem; padding-bottom: 8rem; }
.page-template-template-contact .hero h1 { font-size: clamp(3rem, 5vw, 3.75rem); line-height: 1.1; letter-spacing: -.02em; font-weight: 800; }
.page-template-template-contact .hero p { max-width: 600px; font-size: 1.25rem; line-height: 1.6; }
.contact-page-section { margin-top: -4rem; padding: 0 0 clamp(4rem, 7vw, 6rem); position: relative; z-index: 2; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr); gap: 3rem; align-items: start; }
.contact-side { display: grid; gap: 1.5rem; }
.contact-info-card,
.contact-support-card,
.contact-form-card { border: 1px solid var(--border); border-radius: 12px; background: var(--background); padding: 2.5rem; box-shadow: none; }
.contact-info-card h2,
.contact-form-card__head h2 { margin: 0 0 2rem; color: var(--foreground); font-size: 1.5rem; line-height: 1.45; font-weight: 650; }
.contact-info-list { display: grid; gap: 1.5rem; }
.contact-info-item { display: flex; align-items: flex-start; gap: 1rem; border: 0; border-radius: 0; background: transparent; padding: 0; }
.contact-info-item__icon { width: 2.5rem; height: 2.5rem; border-radius: .5rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; background: var(--secondary); color: var(--foreground); }
.contact-info-item__icon .booklio-lucide { width: 1.25rem; height: 1.25rem; }
.contact-info-item h3 { margin: 0 0 .25rem; color: var(--foreground); font-size: .95rem; line-height: 1.5; font-weight: 600; }
.contact-info-item p { margin: 0; color: var(--muted-foreground); line-height: 1.7; font-size: .875rem; }
.contact-form-card__head { margin-bottom: 0; }
.contact-support-card { background: rgba(244,244,245,.35); padding: 2rem; }
.contact-support-card h3 { margin: 0 0 .75rem; color: var(--foreground); font-size: 1.25rem; line-height: 1.45; font-weight: 650; }
.contact-support-card p { margin: 0 0 1.5rem; color: var(--muted-foreground); font-size: .95rem; line-height: 1.6; }
.contact-support-card__actions { display: grid; gap: .75rem; }
.contact-support-card__actions .btn { width: 100%; }
.contact-form-content .gform_wrapper { margin: 0; }
.contact-form-content .gform_fields { row-gap: 1.25rem !important; }
.contact-form-content .gfield_label, .contact-form-content .gform-field-label { color: var(--foreground); font-weight: 500 !important; font-size: .875rem !important; margin-bottom: .5rem !important; }
.contact-form-content .gfield_required, .contact-form-content .gfield_required_text { color: #dc2626 !important; }
.contact-form-content input[type='text'],
.contact-form-content input[type='email'],
.contact-form-content input[type='tel'],
.contact-form-content input[type='url'],
.contact-form-content select,
.contact-form-content textarea { width: 100% !important; min-height: 48px !important; border: 1px solid var(--border) !important; border-radius: 8px !important; background: var(--background) !important; color: var(--foreground) !important; padding: .75rem 1rem !important; font-family: var(--font) !important; font-size: .9375rem !important; box-shadow: none !important; outline: none !important; transition: border-color .2s ease !important; }
.contact-form-content textarea { min-height: 138px !important; resize: none; line-height: 1.8 !important; }
.contact-form-content select { appearance: none !important; -webkit-appearance: none !important; background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='18'%20height='18'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236b6b6b'%20stroke-width='2.4'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E") !important; background-position: left 1rem center !important; background-size: 18px 18px !important; background-repeat: no-repeat !important; padding-left: 3rem !important; line-height: 1.5 !important; }
.contact-form-content input:focus, .contact-form-content select:focus, .contact-form-content textarea:focus { border-color: rgba(10,10,10,.4) !important; box-shadow: none !important; }
.contact-form-content .gform_footer { margin-top: 1.25rem !important; padding: 0 !important; }
.contact-form-content .gform_button, .contact-form-content input[type='submit'] { width: 100% !important; min-height: 46px !important; border: 1px solid var(--foreground) !important; border-radius: 8px !important; background: var(--foreground) !important; color: var(--background) !important; padding: .7rem 1.25rem !important; font-family: var(--font) !important; font-weight: 500 !important; cursor: pointer !important; transition: opacity .2s ease !important; }
.contact-form-content .gform_button:hover, .contact-form-content input[type='submit']:hover { opacity: .9; transform: none; }
.contact-form-content .gfield_validation_message, .contact-form-content .validation_message { border: 0 !important; background: rgba(220,38,38,.08) !important; color: #b91c1c !important; border-radius: 10px !important; padding: .5rem .75rem !important; font-size: .82rem !important; margin-top: .4rem !important; }
.contact-form-content .gform_validation_errors { border: 1px solid rgba(220,38,38,.25) !important; border-radius: 14px !important; background: rgba(220,38,38,.06) !important; box-shadow: none !important; margin-bottom: 1rem !important; }
.contact-form-content .gform_confirmation_message { border: 1px solid rgba(22,163,74,.25); border-radius: 14px; background: rgba(22,163,74,.08); color: #166534; padding: 1rem; line-height: 1.8; }
.contact-form-placeholder { border: 1px dashed var(--border); border-radius: 12px; background: rgba(244,244,245,.45); color: var(--muted-foreground); padding: 1rem; font-size: .95rem; line-height: 1.8; text-align: center; }
@media (max-width: 980px) { .contact-layout { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
    .page-template-template-contact .hero { padding-top: 4rem; padding-bottom: 6rem; }
    .contact-page-section { margin-top: -3rem; }
    .contact-info-card,
    .contact-support-card,
    .contact-form-card { padding: 1.5rem; }
}

/* Header and footer refinements */
.mobile-toggle { position: relative; align-items: center; justify-content: center; color: var(--foreground); }
.mobile-toggle span, .mobile-toggle span::before, .mobile-toggle span::after { display: block; width: 18px; height: 2px; border-radius: 999px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }
.mobile-toggle span::before, .mobile-toggle span::after { content: ''; position: absolute; left: 50%; margin-left: -9px; }
.mobile-toggle span::before { transform: translateY(-6px); }
.mobile-toggle span::after { transform: translateY(6px); }
.site-header.is-open .mobile-toggle span { background: transparent; }
.site-header.is-open .mobile-toggle span::before { transform: rotate(45deg); }
.site-header.is-open .mobile-toggle span::after { transform: rotate(-45deg); }
.mobile-panel { position: absolute; top: 100%; inset-inline: 0; background: rgba(255,255,255,.98); border-bottom: 1px solid var(--border); box-shadow: 0 20px 45px rgba(0,0,0,.08); backdrop-filter: blur(20px); }
.mobile-panel[hidden] { display: none; }
.mobile-panel__inner { padding-block: 1rem 1.25rem; }
.mobile-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.mobile-nav a { display: flex; align-items: center; min-height: 44px; border-radius: 12px; padding: .65rem .85rem; color: rgba(10,10,10,.76); font-weight: 800; }
.mobile-nav a:hover, .mobile-nav .current-menu-item > a, .mobile-nav .current-menu-ancestor > a { background: var(--secondary); color: var(--foreground); }
.mobile-panel__actions { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .75rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.has-mobile-menu body { overflow: hidden; }
.site-nav .current-menu-ancestor > a, .site-nav .current-menu-parent > a { color: var(--foreground); background: rgba(244,244,245,.85); }
.site-footer__brand-col { max-width: 360px; }
.site-footer__logo { height: 32px; width: auto; filter: brightness(0) invert(1); opacity: .72; margin-bottom: 1.25rem; }
.enamad { justify-content: flex-start; }
.enamad a { display: inline-flex; align-items: flex-start; justify-content: flex-start; }
.enamad img { cursor: pointer; object-fit: contain; }
.footer-menu a { display: inline-flex; align-items: center; min-height: 26px; }
.social-row p { margin: 0; text-align: center; color: rgba(255,255,255,.45); }
@media (min-width: 1025px) { .mobile-panel { display: none !important; } }
@media (max-width: 1024px) {
  .site-header.is-open .site-nav { display: none; }
  .site-header.is-open .site-nav ul { display: none; }
  .mobile-panel__actions .btn { width: 100%; }
}
@media (max-width: 560px) { .mobile-panel__actions { grid-template-columns: 1fr; } }
html.has-mobile-menu, html.has-mobile-menu body { overflow: hidden; }

/* Homepage refinement pass */
.problem-cards--split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.problem-card { height: 100%; }
.problem-card .card__body { display: flex; flex-direction: column; min-height: 270px; }
.problem-card span { display: inline-flex; align-self: flex-start; margin-bottom: .9rem; border-radius: 999px; padding: .32rem .7rem; font-size: .78rem; font-weight: 850; }
.problem-card--before span { background: rgba(10,10,10,.07); color: rgba(10,10,10,.62); }
.problem-card--after span { background: var(--foreground); color: var(--background); }
.problem-card h3 { font-size: 1.18rem; line-height: 1.55; }
.problem-card ul { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .55rem; color: rgba(10,10,10,.68); font-size: .92rem; }
.problem-card li { position: relative; padding-right: 1.2rem; line-height: 1.7; }
.problem-card li::before { content: ''; position: absolute; right: 0; top: .72em; width: 6px; height: 6px; border-radius: 999px; background: rgba(10,10,10,.35); }
.problem-card--after li::before { background: var(--foreground); }
.home-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; align-items: stretch; }
.home-feature-grid .feature-tile { min-height: 100%; }
.home-feature-grid .feature-tile__image img { height: 210px; object-fit: cover; }
.home-plan-card .card__body { display: flex; flex-direction: column; height: 100%; }
.home-plan-card .btn { margin-top: auto; }
.home-plan-card__features { margin: 1.25rem 0 1.5rem; font-size: .92rem; line-height: 1.75; }
.home-plan-card__features ul, .home-plan-card__fallback-features { margin: 0; padding: 0; list-style: none; display: grid; gap: .55rem; }
.home-plan-card__features li, .home-plan-card__fallback-features li { position: relative; padding-right: 1.35rem; color: rgba(10,10,10,.72); }
.home-plan-card__features li::before, .home-plan-card__fallback-features li::before { content: '✓'; position: absolute; right: 0; top: 0; color: var(--foreground); font-weight: 950; }
@media (max-width: 1024px) { .home-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .problem-cards--split, .home-feature-grid { grid-template-columns: 1fr; } .problem-card .card__body { min-height: 0; } }

/* Editable features page */
.feature-tile--editable h3 a { transition: color .2s ease; }
.feature-tile--editable h3 a:hover { color: rgba(10,10,10,.65); }
.feature-tile--editable .feature-tile__image { min-height: 210px; }
.feature-tile--editable .feature-tile__image img { width: 100%; height: 230px; object-fit: cover; }
.post-type-archive-booklio_feature .hero--compact { padding-bottom: 4rem; }
@media (max-width: 680px) { .feature-tile--editable .feature-tile__image img { height: 210px; } }

/* Plans page refinement */
.plans-pricing-section { padding-top: clamp(3.5rem, 6vw, 5.5rem); }
.plans-pricing-grid { align-items: stretch; }
.plans-card { height: 100%; }
.plans-card .card__body { min-height: 100%; display: flex; flex-direction: column; }
.plans-card .btn { width: 100%; margin-top: auto; }
.plans-card__features { margin: 1.25rem 0 1.5rem; font-size: .93rem; }
.plans-card__features ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .55rem; }
.plans-card__features li { position: relative; padding-right: 1.35rem; color: rgba(10,10,10,.72); }
.plans-card__features li::before { content: '✓'; position: absolute; right: 0; top: 0; color: var(--foreground); font-weight: 950; }
.plans-purchase-notes { margin-top: 2rem; }
.plans-table-wrap { max-width: 1120px; margin-inline: auto; border-radius: 18px; }
.plans-comparison-table { min-width: 760px; }
.plans-comparison-table thead th { background: #fff; }
.plans-comparison-table tbody tr:not(.pricing-table__group):hover td { background: rgba(0,0,0,.07); }
.plan-feature-label { display: inline-flex; align-items: center; gap: .45rem; white-space: normal; }
.plan-help { position: relative; width: 20px; height: 20px; border: 0; border-radius: 999px; background: rgba(10,10,10,.08); color: rgba(10,10,10,.45); display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: help; flex: 0 0 auto; }
.plan-help span { font-size: .78rem; line-height: 1; font-weight: 900; }
.plan-help em { position: absolute; right: 50%; bottom: calc(100% + .55rem); transform: translateX(50%) translateY(4px); min-width: 220px; max-width: 280px; border: 1px solid var(--border); border-radius: 12px; background: #111; color: #fff; padding: .75rem .85rem; font-style: normal; font-size: .82rem; font-weight: 500; line-height: 1.75; white-space: normal; text-align: right; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s ease, transform .18s ease, visibility .18s ease; z-index: 20; box-shadow: 0 18px 45px rgba(0,0,0,.18); }
.plan-help:hover em, .plan-help:focus-visible em { opacity: 1; visibility: visible; transform: translateX(50%) translateY(0); }
.plan-yes, .plan-no { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 999px; font-size: 1rem; font-weight: 950; }
.plan-yes { background: rgba(10,10,10,.08); color: var(--foreground); }
.plan-no { background: rgba(10,10,10,.04); color: rgba(10,10,10,.35); }
.plans-extra-content { max-width: 900px; margin: 3rem auto 0; }
@media (max-width: 1024px) {
  .pricing-table-wrap,
  .plans-table-wrap {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
    contain: paint;
  }
}

@media (max-width: 720px) {
  .plans-comparison-table { min-width: 680px; }
  .plans-comparison-table th, .plans-comparison-table td { padding-inline: .9rem; }
  .plan-help em { right: auto; left: 0; transform: translateY(4px); }
  .plan-help:hover em, .plan-help:focus-visible em { transform: translateY(0); }
}

/* Use case editable pages */
.use-case-card { height: 100%; display: flex; flex-direction: column; }
.use-case-card__media { height: 250px; background: #fff; border-bottom: 1px solid var(--border); }
.use-case-card__media img { width: 100%; height: 100%; object-fit: contain; padding: .35rem; }
.use-case-card__body { flex: 1; display: flex; flex-direction: column; }
.use-case-card__eyebrow { display: inline-flex; align-self: flex-start; margin-bottom: .65rem; border-radius: 999px; background: var(--secondary); color: rgba(10,10,10,.62); padding: .28rem .65rem; font-size: .74rem; font-weight: 850; }
.use-case-card__body h2 { font-size: 1.15rem; }
.use-case-card__body p { margin-bottom: 1rem; }
.use-case-card__link { margin-top: auto; color: var(--foreground); font-size: .88rem; font-weight: 850; }
.use-case-card__link::after { content: ' ←'; }
.use-case-benefit-card .card__body { min-height: 210px; }
.use-case-benefit-card span { width: 34px; height: 34px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: rgba(10,10,10,.08); color: var(--foreground); font-weight: 950; margin-bottom: 1rem; }
.use-case-benefit-card h3 { font-size: 1rem; }
.use-case-workflow-grid .workflow-card { min-height: 210px; }
.use-case-editor-content h2:first-child { margin-top: 0; }
.related-use-cases .use-case-card__media { height: 220px; }
@media (max-width: 680px) { .use-case-card__media, .related-use-cases .use-case-card__media { height: 220px; } .use-case-benefit-card .card__body, .use-case-workflow-grid .workflow-card { min-height: 0; } }

/* React home parity pass */
.site-header__inner { padding-block: 1rem; min-height: auto; }
.site-nav a { font-size: 1rem; font-weight: 700; }
.header-actions .btn { font-weight: 700; }
.home-hero { padding: 6.5rem 0 6rem; }
.home-hero__copy { margin-bottom: 3rem; }
.home-hero__copy h1 { font-size: clamp(3rem, 5.4vw, 4.5rem); line-height: 1.3; font-weight: 950; white-space: pre-line; }
.home-hero__copy p { font-size: clamp(1.08rem, 1.7vw, 1.25rem); max-width: 700px; }
.home-hero__actions { margin-top: 2.5rem; }
.home-marquee { margin: 0 0 3.5rem; }
.home-marquee__fade { position: absolute; top: 0; bottom: 0; z-index: 2; width: 17%; pointer-events: none; }
.home-marquee__fade--left { left: 0; background: linear-gradient(to right, var(--background), transparent); }
.home-marquee__fade--right { right: 0; background: linear-gradient(to left, var(--background), transparent); }
.trust-card-section { background: var(--background); padding-top: 1.5rem; padding-bottom: 6rem; }
.trust-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1rem; align-items: stretch; }
.trust-card { height: 100%; display: flex; flex-direction: column; gap: .85rem; align-items: center; text-align: center; border: 1px solid var(--border); border-radius: 16px; background: #fff; padding: 1.5rem; transition: transform .2s ease, box-shadow .2s ease; }
.trust-card:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,.08); }
.trust-card > span { width: 40px; height: 40px; border-radius: 999px; border: 1px solid var(--border); background: var(--secondary); display: inline-flex; align-items: center; justify-content: center; font-weight: 900; }
.trust-card h2 { margin: 0; font-size: 1rem; line-height: 1.45; font-weight: 800; }
.trust-card p { margin: 0; color: var(--muted-foreground); font-size: .88rem; line-height: 1.7; }
.problem-solution-section { border-top: 1px solid var(--border); padding-block: 8rem; }
.problem-solution-head { margin-bottom: 6rem; }
.home-section-head-large h2, .problem-solution-head h2, .dark-section-head h2 { font-size: clamp(2.6rem, 5vw, 4.5rem); line-height: 1.3; font-weight: 850; }
.home-section-head-large p, .problem-solution-head p, .dark-section-head p { font-size: clamp(1.05rem, 1.6vw, 1.25rem); }
.problem-solution-grid { max-width: 1200px; margin-inline: auto; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem; }
.problem-panel { border: 1px solid var(--border); border-radius: 16px; padding: clamp(1.5rem, 3vw, 2.5rem); min-height: 100%; }
.problem-panel--bad { background: var(--background); }
.problem-panel--good { background: #fff; border-width: 2px; border-color: var(--foreground); }
.problem-panel__title { display: flex; align-items: center; gap: .75rem; margin-bottom: 2rem; }
.problem-panel__title span { width: 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--secondary); color: var(--muted-foreground); font-weight: 950; }
.problem-panel--good .problem-panel__title span { background: var(--foreground); color: var(--background); }
.problem-panel h3 { margin: 0; font-size: 1.55rem; line-height: 1.4; }
.problem-panel ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 1rem; }
.problem-panel li { display: flex; gap: .75rem; align-items: flex-start; color: var(--muted-foreground); line-height: 1.8; font-size: 1rem; }
.problem-panel li span { flex: 0 0 auto; margin-top: .15rem; color: rgba(10,10,10,.45); font-weight: 900; }
.problem-panel--good li { color: var(--foreground); font-weight: 700; }
.problem-panel--good li span { color: var(--foreground); }
.dark-flow-section, .guided-setup-dark { position: relative; overflow: hidden; background: rgba(10,10,10,.95); color: var(--background); border-top: 1px solid rgba(255,255,255,.08); }
.dark-flow-section { padding-top: 8rem; padding-bottom: 3rem; }
.dark-flow-pattern { position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.21) 1px, transparent 1px); background-size: 20px 20px; mask-image: radial-gradient(circle at 50% 50%, #000 0%, rgba(0,0,0,.75) 55%, rgba(0,0,0,.15) 80%, transparent 100%); -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 0%, rgba(0,0,0,.75) 55%, rgba(0,0,0,.15) 80%, transparent 100%); }
.dark-flow-glow, .guided-dark-glow { position: absolute; inset: 0; background: radial-gradient(ellipse 75% 55% at 50% 12%, rgba(255,255,255,.10) 0%, transparent 72%); pointer-events: none; }
.dark-flow-inner, .guided-setup-inner { position: relative; z-index: 1; }
.dark-section-head { margin-bottom: 6rem; }
.dark-section-head h2 { color: var(--background); }
.dark-section-head p { color: rgba(250,250,250,.78); }
.dark-flow-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.5rem; margin-bottom: 6rem; }
.dark-flow-card { text-align: center; padding: 1.5rem; border-radius: 16px; }
.dark-flow-card span { width: 40px; height: 40px; margin: 0 auto 1rem; border-radius: 999px; background: rgba(255,255,255,.1); color: var(--background); display: flex; align-items: center; justify-content: center; font-weight: 900; }
.dark-flow-card h3 { margin: 0 0 .75rem; font-size: 1.1rem; color: var(--background); }
.dark-flow-card p { margin: 0; color: rgba(250,250,250,.78); line-height: 1.8; }
.feature-tiles-section { padding-block: 7rem; }
.react-feature-rows { gap: 1.5rem; }
.react-feature-tile { border-radius: 1.5rem; border-color: #e2e8f0; background: rgba(255,255,255,.95); }
.react-feature-tile .feature-tile__body { padding: 1.35rem 1.5rem; }
.react-feature-tile .feature-tile__image img { height: 220px; object-fit: cover; }
.react-usecases-section { padding-block: 7rem; background: var(--background); border-top: 1px solid var(--border); }
.react-usecase-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; }
.react-usecase-card { display: block; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: #fff; transition: transform .3s ease, box-shadow .3s ease; }
.react-usecase-card:hover { transform: translateY(-4px); box-shadow: 0 8px 32px rgba(0,0,0,.08); }
.react-usecase-card__image { position: relative; height: 16rem; border-bottom: 1px solid var(--border); }
.react-usecase-card__image img { width: 100%; height: 100%; object-fit: contain; }
.react-usecase-card__body { padding: 1.5rem 1.75rem; }
.react-usecase-card__body h3 { margin: 0; font-size: 1.28rem; line-height: 1.35; font-weight: 850; }
.react-usecase-card__body p { margin: .75rem 0 0; color: var(--muted-foreground); line-height: 1.8; }
.comparison-section { padding-block: 8rem; border-top: 1px solid var(--border); }
.comparison-shell { max-width: 1200px; }
.comparison-table-frame { border-radius: 24px; background: var(--border); padding: 1px; }
.comparison-table-scroll { overflow-x: auto; border-radius: 24px; background: var(--background); }
.comparison-table { width: 100%; min-width: 960px; border-collapse: separate; border-spacing: 0; }
.comparison-table th, .comparison-table td { border-bottom: 1px solid var(--border); border-left: 1px solid var(--border); padding: 1rem; font-size: .875rem; line-height: 1.8; }
.comparison-table th { color: var(--muted-foreground); font-weight: 700; text-align: center; }
.comparison-table th:first-child, .comparison-table td:first-child { text-align: right; color: var(--foreground); font-weight: 800; }
.comparison-table th:nth-child(2), .comparison-table td.is-booklio { background: rgba(10,10,10,.04); color: var(--foreground); font-weight: 800; }
.comparison-table td { text-align: center; color: var(--muted-foreground); }
.comparison-table tr:last-child td { border-bottom: 0; }
.comparison-table th:last-child, .comparison-table td:last-child { border-left: 0; }
.comparison-no { color: rgba(10,10,10,.45); font-size: 1.4rem; }
.comparison-note { text-align: center; margin: 2rem auto 0; color: rgba(95,95,95,.68); font-size: .88rem; }
.guided-setup-dark { padding-block: 7rem 6rem; }
.guided-dark-lines { position: absolute; inset: 0; background-image: linear-gradient(to right, rgba(255,255,255,.06) .8px, transparent .8px, transparent 16px, rgba(255,255,255,.03) 16px, rgba(255,255,255,.03) 16.8px, transparent 16.8px, transparent 32px); background-size: 32px 100%; mask-image: radial-gradient(ellipse 86% 58% at 50% 16%, #000 0%, rgba(0,0,0,.92) 52%, rgba(0,0,0,.28) 78%, transparent 100%); -webkit-mask-image: radial-gradient(ellipse 86% 58% at 50% 16%, #000 0%, rgba(0,0,0,.92) 52%, rgba(0,0,0,.28) 78%, transparent 100%); }
.guided-kicker span { color: var(--background); border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.08); }
.guided-btn { background: var(--background); color: var(--foreground); border-color: var(--background); }
.guided-step-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.guided-step-grid article { position: relative; border-block: 1px solid rgba(255,255,255,.08); border-right: 1px solid rgba(255,255,255,.08); padding: 2.5rem 1.75rem 1.5rem; }
.guided-step-grid article:first-child { border-right: 0; }
.guided-step-grid article > span { width: 44px; height: 44px; display: block; margin-bottom: 2.5rem; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(255,255,255,.03); }
.guided-step-grid h3 { margin: 0 0 1rem; color: var(--background); font-size: 1.25rem; }
.guided-step-grid p { margin: 0; color: rgba(250,250,250,.68); line-height: 1.8; max-width: 320px; }
.plans-section { padding-block: 8rem; border-top: 1px solid var(--border); }
.plans-section .section-head { margin-bottom: 6rem; }
.plans-section .pricing-preview-grid { max-width: 1200px; margin-inline: auto; }
.plans-section .pricing-card { border-radius: 12px; background: var(--background); }
.plans-section .pricing-card .card__body { padding: 2.5rem; }
.plans-section .pricing-card.is-featured { border-width: 2px; border-color: var(--foreground); }
.react-purchase-notes { max-width: 1200px; }
@media (max-width: 1024px) { .trust-card-grid, .dark-flow-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .react-usecase-grid, .guided-step-grid { grid-template-columns: 1fr; } .guided-step-grid article { border-right: 0; } }
@media (max-width: 760px) { .home-hero { padding-top: 4rem; } .trust-card-grid, .problem-solution-grid, .dark-flow-grid { grid-template-columns: 1fr; } .problem-solution-section, .comparison-section, .plans-section { padding-block: 5rem; } .dark-flow-section { padding-top: 5rem; } .home-section-head-large h2, .problem-solution-head h2, .dark-section-head h2 { font-size: clamp(2.2rem, 11vw, 3.2rem); } }

/* WordPress admin bar parity adjustment */
.admin-bar .site-header { top: 32px; }
.admin-bar .mobile-panel { top: 100%; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

/* Match React home vertical rhythm more closely */
.home .site-main { padding-top: var(--header-height); }
.home-hero__tag { margin-bottom: 2rem; }
.hero-screen { box-shadow: none; }
.hero-screen .hero-screen__bar, .hero-screen__image { background-clip: padding-box; }
.trust-card-section + .problem-solution-section { margin-top: 0; }

/* React FAQ parity */
.home-faq-section { border-top: 1px solid var(--border); background: var(--background); padding-block: 8rem; }
.home-faq-grid { max-width: 1180px; display: grid; grid-template-columns: .82fr 1.18fr; gap: 5rem; align-items: start; }
.home-faq-heading { position: sticky; top: calc(var(--header-height) + 2rem); }
.home-faq-heading p { margin: 0 0 1.25rem; color: var(--muted-foreground); font-size: .92rem; font-weight: 700; }
.home-faq-heading h2 { margin: 0; max-width: 520px; font-size: clamp(2.2rem, 4vw, 3.25rem); line-height: 1.28; font-weight: 850; }
.home-faq-list { border-top: 1px solid var(--border); }
.home-faq-item { border-bottom: 1px solid var(--border); }
.home-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.55rem 0; cursor: pointer; list-style: none; }
.home-faq-item summary::-webkit-details-marker { display: none; }
.home-faq-item summary span { color: var(--foreground); font-size: .95rem; font-weight: 700; line-height: 1.6; }
.home-faq-item summary b { font-size: 1.25rem; line-height: 1; font-weight: 400; transition: transform .2s ease; }
.home-faq-item[open] summary b { transform: rotate(45deg); }
.home-faq-item p { margin: 0; padding: 0 0 1.75rem; color: var(--muted-foreground); line-height: 2; font-size: 1rem; }
@media (max-width: 980px) { .home-faq-grid { grid-template-columns: 1fr; gap: 2.5rem; } .home-faq-heading { position: static; } }

/* React typography parity corrections */
.home-hero__copy h1 {
  font-size: clamp(2.75rem, 5vw, 3.75rem) !important;
  line-height: 1.3 !important;
  font-weight: 950 !important;
  letter-spacing: -0.045em;
}
.home-hero__copy p,
.home-section-head-large p,
.problem-solution-head p,
.dark-section-head p,
.section-head p {
  font-size: clamp(1.05rem, 1.6vw, 1.25rem) !important;
  line-height: 1.8 !important;
}
.home-section-head-large h2,
.problem-solution-head h2,
.dark-section-head h2,
.feature-tiles-section .section-head h2,
.react-usecases-section .section-head h2,
.comparison-section .section-head h2,
.plans-section .section-head h2 {
  font-size: clamp(2.5rem, 4.8vw, 3.75rem) !important;
  line-height: 1.3 !important;
  font-weight: 850 !important;
  letter-spacing: -0.035em;
}
.home-faq-heading h2 {
  font-size: clamp(2.25rem, 4vw, 3rem) !important;
  line-height: 1.3 !important;
  font-weight: 850 !important;
}
.hero h1 {
  font-size: clamp(2.5rem, 4.8vw, 3.75rem) !important;
  line-height: 1.3 !important;
  font-weight: 850 !important;
}
.hero p {
  font-size: clamp(1.05rem, 1.6vw, 1.25rem) !important;
  line-height: 1.8 !important;
}
@keyframes booklio-marquee-reverse {
  from { transform: translateX(-33.333%); }
  to { transform: translateX(0); }
}
.home-marquee__track {
  animation-name: booklio-marquee-reverse !important;
}
@media (max-width: 760px) {
  .home-hero__copy h1,
  .home-section-head-large h2,
  .problem-solution-head h2,
  .dark-section-head h2,
  .feature-tiles-section .section-head h2,
  .react-usecases-section .section-head h2,
  .comparison-section .section-head h2,
  .plans-section .section-head h2,
  .hero h1 {
    font-size: clamp(2.25rem, 10vw, 3.2rem) !important;
  }
}

/* Unified icon system */
.booklio-icon,
.booklio-list-icon,
.booklio-step-icon,
.plan-yes,
.plan-no,
.feature-checklist span::before,
.home-plan-card__features li::before,
.home-plan-card__fallback-features li::before,
.plans-card__features li::before {
  font-family: var(--font);
  line-height: 1;
}
.booklio-icon { width: 40px; height: 40px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); background: var(--secondary); color: var(--foreground); font-size: 0; font-weight: 900; flex: 0 0 auto; }
.booklio-icon::before { font-size: 1rem; line-height: 1; }
.booklio-icon--check::before { content: '✓'; }
.booklio-icon--x::before { content: '×'; font-size: 1.25rem; color: rgba(10,10,10,.48); }
.booklio-icon--refresh::before { content: '↻'; }
.booklio-icon--lang::before { content: 'فا'; font-size: .78rem; letter-spacing: -0.03em; }
.booklio-icon--shield::before { content: '◌'; font-size: 1.25rem; }
.booklio-icon--rocket::before { content: '↑'; font-size: 1.05rem; transform: rotate(-45deg); }
.booklio-list-icon { width: 18px; height: 18px; margin-top: .28rem; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; background: rgba(10,10,10,.06); color: rgba(10,10,10,.5); font-size: 0; }
.booklio-list-icon::before { font-size: .72rem; font-weight: 950; }
.booklio-list-icon--check { background: rgba(10,10,10,.1); color: var(--foreground); }
.booklio-list-icon--check::before { content: '✓'; }
.booklio-list-icon--x::before { content: '×'; font-size: .9rem; }
.booklio-step-icon { width: 40px; height: 40px; margin: 0 auto 1rem; border-radius: 999px; background: rgba(255,255,255,.1); color: var(--background); display: flex; align-items: center; justify-content: center; font-weight: 900; }
.trust-card > .booklio-icon { margin-bottom: .15rem; }
.problem-panel__title .booklio-icon { border-radius: 10px; margin: 0; }
.problem-panel--good .problem-panel__title .booklio-icon { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
.problem-panel--good .problem-panel__title .booklio-icon::before { color: var(--background); }
.problem-panel li .booklio-list-icon { margin-inline-end: 0; }
.problem-panel li span.booklio-list-icon { color: rgba(10,10,10,.5); }
.problem-panel--good li span.booklio-list-icon { background: var(--foreground); color: var(--background); }
.problem-panel--good li span.booklio-list-icon::before { color: var(--background); }
.guided-step-grid article > .booklio-icon { width: 44px; height: 44px; margin-bottom: 2.5rem; border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.03); color: rgba(250,250,250,.8); }
.guided-step-grid article > .booklio-icon::before { color: rgba(250,250,250,.8); }
.comparison-no.booklio-icon { width: 26px; height: 26px; border: 0; background: rgba(10,10,10,.045); vertical-align: middle; }
.plan-yes, .plan-no { width: 28px !important; height: 28px !important; border-radius: 999px !important; font-size: 0 !important; }
.plan-yes::before, .plan-no::before { font-size: .9rem; font-weight: 950; }
.plan-yes::before { content: '✓'; }
.plan-no::before { content: '×'; font-size: 1.05rem; color: rgba(10,10,10,.42); }
.feature-checklist span::before { width: 18px; height: 18px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: rgba(10,10,10,.08); font-size: .72rem; }
.home-plan-card__features li::before,
.home-plan-card__fallback-features li::before,
.plans-card__features li::before { width: 18px; height: 18px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: rgba(10,10,10,.08); font-size: .72rem; top: .15rem; }
.workflow-card span,
.use-case-benefit-card span { border: 1px solid rgba(10,10,10,.06); }

/* Local Lucide SVG icon system */
.booklio-lucide { width: 1.25rem; height: 1.25rem; stroke: currentColor; flex: 0 0 auto; }
.booklio-lucide--sm { width: .95rem; height: .95rem; }
.booklio-icon-wrap { width: 40px; height: 40px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); background: var(--secondary); color: var(--foreground); flex: 0 0 auto; }
.booklio-icon-wrap--dark { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.03); color: rgba(250,250,250,.8); }
.booklio-icon::before,
.booklio-list-icon::before,
.booklio-icon--check::before,
.booklio-icon--x::before,
.booklio-icon--refresh::before,
.booklio-icon--lang::before,
.booklio-icon--shield::before,
.booklio-icon--rocket::before,
.plan-yes::before,
.plan-no::before { content: none !important; }
.trust-card > .booklio-icon-wrap { margin-bottom: .15rem; }
.problem-panel__title .booklio-icon-wrap { border-radius: 10px; }
.problem-panel--good .problem-panel__title .booklio-icon-wrap { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
.booklio-list-icon { width: auto; height: auto; margin-top: .3rem; border-radius: 0; background: transparent; color: rgba(10,10,10,.42); }
.problem-panel--good .booklio-list-icon { background: transparent !important; color: var(--foreground) !important; }
.guided-step-grid article > .booklio-icon-wrap { width: 44px; height: 44px; margin-bottom: 2.5rem; }
.react-purchase-notes .booklio-lucide { width: 1.5rem; height: 1.5rem; margin: 0 auto 1rem; color: var(--foreground); }
.home-faq-item summary b { width: 1.1rem; height: 1.1rem; display: inline-flex; align-items: center; justify-content: center; }
.home-faq-item summary b .booklio-lucide { transition: transform .2s ease; }
.home-faq-item[open] summary b { transform: none; }
.home-faq-item[open] summary b .booklio-lucide { transform: rotate(45deg); }

/* Fix Lucide placement in comparison and guided setup */
.comparison-no {
  width: 28px !important;
  height: 28px !important;
  margin-inline: auto;
  border-radius: 999px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(10,10,10,.045);
  color: rgba(10,10,10,.45) !important;
  font-size: 0 !important;
  vertical-align: middle;
}
.comparison-no .booklio-lucide {
  width: 1rem;
  height: 1rem;
}
.guided-step-grid article > .booklio-icon-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  margin: 0 0 2.5rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  background: rgba(255,255,255,.03) !important;
  color: rgba(250,250,250,.8) !important;
}
.guided-step-grid article > .booklio-icon-wrap .booklio-lucide {
  width: 1.25rem;
  height: 1.25rem;
}

/* Home hero exact React parity refinement */
.home .site-main {
  padding-top: var(--header-height) !important;
}
.home-hero {
  padding-block: 7rem !important;
  padding-inline: 0 !important;
}
.home-hero__copy {
  max-width: 860px !important;
  margin-inline: auto !important;
  margin-bottom: 3rem !important;
}
.home-hero__copy h1 {
  max-width: none !important;
  white-space: normal !important;
  font-size: clamp(3rem, 5vw, 3.75rem) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.045em !important;
  font-weight: 950 !important;
  margin-bottom: 1.5rem !important;
}
.home-hero__copy p {
  max-width: 700px !important;
  margin-inline: auto !important;
}
.home-marquee {
  margin-bottom: 3.5rem !important;
}
@media (max-width: 760px) {
  .home-hero {
    padding-block: 4rem 5rem !important;
  }
  .home-hero__copy h1 {
    font-size: clamp(2.25rem, 10vw, 3.2rem) !important;
  }
}

/* Live-measured React hero parity */
.home-hero {
  padding-block: 6.4rem !important;
}
.home-hero__copy h1 {
  font-size: clamp(3rem, 4.35vw, 3.25rem) !important;
}

/* Home hero top spacing refinement */
.home-hero {
  padding-top: 5.25rem !important;
}

/* Home hero marquee badge typography refinement */
.home-marquee__track span,
.home-marquee span {
  font-size: 0.875rem !important;
  font-weight: 650 !important;
}

/* Align home hero top spacing with inner page heroes */
.home-hero {
  padding-top: 5rem !important;
}

/* Match home hero top spacing to compact inner heroes */
.home-hero {
  padding-top: 4.5rem !important;
}

/* Home non-hero section typography refinement */
.home-section-head-large h2,
.problem-solution-head h2,
.dark-section-head h2,
.feature-tiles-section .section-head h2,
.react-usecases-section .section-head h2,
.comparison-section .section-head h2,
.guided-setup-dark .section-head h2,
.plans-section .section-head h2,
.home-faq-heading h2 {
  font-size: clamp(2.2rem, 4vw, 3.25rem) !important;
  line-height: 1.28 !important;
}
.home-section-head-large p,
.problem-solution-head p,
.dark-section-head p,
.feature-tiles-section .section-head p,
.react-usecases-section .section-head p,
.comparison-section .section-head p,
.guided-setup-dark .section-head p,
.plans-section .section-head p,
.home-faq-heading p {
  font-size: clamp(0.98rem, 1.35vw, 1.125rem) !important;
  line-height: 1.8 !important;
}

/* Home plans full comparison table */
.home-plans-comparison {
  max-width: 1200px;
  margin: 4rem auto 0;
}
.home-plans-comparison__head {
  max-width: 680px;
  margin-bottom: 2rem;
}
.home-plans-comparison__head h3 {
  margin: 0 0 .75rem;
  color: var(--foreground);
  font-size: clamp(1.6rem, 2.6vw, 2.25rem);
  line-height: 1.35;
  font-weight: 850;
  letter-spacing: -.025em;
}
.home-plans-comparison__head p {
  margin: 0;
  color: var(--muted-foreground);
  font-size: 1rem;
  line-height: 1.8;
}
.home-plans-table-wrap {
  margin-top: 0;
}
.home-plans-comparison-table {
  min-width: 760px;
}
.home-plans-comparison + .purchase-notes {
  margin-top: 3.5rem;
}
@media (max-width: 760px) {
  .home-plans-comparison {
    margin-top: 3rem;
  }
}

/* Home pricing cards matching React pricing section */
.home-pricing-cards {
  max-width: 1200px;
  margin-inline: auto;
  gap: 1.5rem;
  align-items: stretch;
}
.home-pricing-card {
  position: relative;
  min-height: 100%;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--background);
  color: var(--foreground);
}
.home-pricing-card.is-featured {
  border: 2px solid var(--foreground);
  box-shadow: 0 8px 32px rgba(0,0,0,.08);
}
.home-pricing-card__badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: .25rem 1rem;
  border-radius: 999px;
  background: var(--foreground);
  color: var(--background);
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
}
.home-pricing-card__body {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 2.5rem;
}
.home-pricing-card h3 {
  margin: 0 0 .5rem;
  color: var(--foreground);
  font-size: clamp(1.55rem, 2.2vw, 2rem);
  line-height: 1.35;
  font-weight: 850;
}
.home-pricing-card__desc {
  margin: 0 0 2rem;
  color: var(--muted-foreground);
  font-size: .95rem;
  line-height: 1.7;
}
.home-pricing-card__price {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: 2rem;
}
.home-pricing-card__price strong {
  color: var(--foreground);
  font-size: clamp(2.55rem, 4vw, 3.45rem);
  line-height: 1;
  font-weight: 950;
  letter-spacing: -.04em;
}
.home-pricing-card__price span {
  color: var(--muted-foreground);
  font-size: .9rem;
  font-weight: 650;
}
.home-pricing-card__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  margin-bottom: 1.25rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  color: var(--foreground);
  font-size: 1rem;
  font-weight: 800;
  transition: background .2s ease, opacity .2s ease;
}
.home-pricing-card__button:hover {
  background: var(--secondary);
}
.home-pricing-card__button.is-primary {
  border-color: var(--foreground);
  background: var(--foreground);
  color: var(--background);
}
.home-pricing-card__button.is-primary:hover {
  opacity: .9;
}
.home-pricing-card__features {
  margin: 0;
  color: var(--muted-foreground);
  font-size: .95rem;
  line-height: 1.8;
}
.home-pricing-card__features ul {
  display: grid;
  gap: .85rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-pricing-card__features li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin: 0;
  color: var(--muted-foreground);
  font-size: .95rem;
  font-weight: 650;
}
.home-pricing-card__features li::before {
  content: '✓' !important;
  flex: 0 0 auto;
  color: var(--foreground);
  font-weight: 950;
  line-height: 1.8;
}
.home-pricing-card__compare {
  display: inline-flex;
  margin-top: auto;
  padding-top: 1.75rem;
  color: var(--muted-foreground);
  font-size: .92rem;
  font-weight: 850;
}
.home-pricing-card__compare:hover {
  color: var(--foreground);
}
.home-pricing-cards + .purchase-notes {
  margin-top: 4rem;
}
@media (max-width: 1024px) {
  .home-pricing-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .home-pricing-cards {
    grid-template-columns: 1fr;
  }
  .home-pricing-card__body {
    padding: 2rem;
  }
}

/* Exact React pricing card sizing and content rhythm */
.home-pricing-cards {
  max-width: 1200px !important;
  margin-inline: auto !important;
  margin-bottom: 4rem !important;
  gap: 1.5rem !important;
}
.home-pricing-card {
  border-radius: 0.75rem !important;
  background: var(--background) !important;
}
.home-pricing-card.is-featured {
  border-width: 2px !important;
  border-color: var(--foreground) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.08) !important;
}
.home-pricing-card__body {
  padding: 2.5rem !important;
}
.home-pricing-card__badge {
  top: -0.875rem !important;
  padding: 0.25rem 1rem !important;
  font-size: 0.6875rem !important;
  font-weight: 500 !important;
}
.home-pricing-card h3 {
  margin: 0 0 0.5rem !important;
  font-size: 1.375rem !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
}
.home-pricing-card__desc {
  margin: 0 0 2rem !important;
  color: var(--muted-foreground) !important;
  font-size: 0.8125rem !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
}
.home-pricing-card__price {
  margin-bottom: 2rem !important;
  gap: 0.5rem !important;
}
.home-pricing-card__price strong {
  font-size: clamp(32px, 4vw, 42px) !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
}
.home-pricing-card__price span {
  color: var(--muted-foreground) !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
}
.home-pricing-card__button {
  min-height: 44px !important;
  margin-bottom: 1.25rem !important;
  border-radius: 0.5rem !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
}
.home-pricing-card__features ul {
  gap: 0.875rem !important;
}
.home-pricing-card__features li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.75rem !important;
  color: var(--muted-foreground) !important;
  font-size: 0.8125rem !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
}
.home-pricing-card__features li::before {
  content: none !important;
}
.home-pricing-card__check {
  width: 1rem !important;
  height: 1rem !important;
  margin-top: 0.125rem !important;
  color: var(--foreground) !important;
  flex: 0 0 auto !important;
}
.home-pricing-card__features li span {
  color: var(--muted-foreground) !important;
}
.home-pricing-card__compare {
  gap: 0.375rem !important;
  padding-top: 1.25rem !important;
  color: var(--muted-foreground) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: color .2s ease, text-decoration-color .2s ease !important;
}
.home-pricing-card__compare:hover {
  color: var(--foreground) !important;
  text-decoration: underline !important;
}
.home-pricing-cards + .purchase-notes {
  margin-top: 0 !important;
}

/* Footer social icon buttons */
.social-links {
  gap: 0.65rem !important;
}
.social-links a {
  width: 38px;
  height: 38px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.68) !important;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.social-links a:hover {
  border-color: rgba(255,255,255,.24);
  background: rgba(255,255,255,.09);
  color: #fff !important;
  transform: translateY(-1px);
}
.social-link-icon {
  width: 1.05rem !important;
  height: 1.05rem !important;
  stroke-width: 2 !important;
}

/* API pricing unit display */
.plans-card .plan-price span {
  color: var(--muted-foreground);
  font-size: 0.9rem;
  font-weight: 500;
}

/* Home pricing card text weight and feature spacing refinement */
.home-pricing-card h3 {
  font-weight: 750 !important;
}
.home-pricing-card__features ul {
  gap: 0.6rem !important;
}
.home-pricing-card__features li,
.home-pricing-card__features li span {
  font-weight: 600 !important;
}

/* Footer bottom row layout */
.social-row {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1.5rem !important;
}
.social-row .social-links {
  order: 2;
  justify-content: flex-start !important;
}
.social-row p {
  order: 1;
  text-align: right !important;
}
@media (max-width: 720px) {
  .social-row {
    flex-direction: column !important;
    align-items: center !important;
  }
  .social-row .social-links,
  .social-row p {
    order: initial;
    text-align: center !important;
  }
}

/* Constrain footer visual width to the site container */
.site-footer {
  background: var(--background) !important;
  border-top: 0 !important;
  padding-inline: var(--site-pad-x);
}
.site-footer__pattern {
  width: min(100%, var(--site-max-width));
  margin-inline: auto;
  background: #0a0a0a;
  border: 1px solid rgba(250,250,250,.1);
  border-bottom: 0;
  border-radius: 24px 24px 0 0;
}
.site-footer__pattern > .site-shell {
  width: 100%;
  max-width: none;
  padding-inline: var(--site-pad-x);
}
@media (max-width: 720px) {
  .site-footer {
    padding-inline: 0;
  }
  .site-footer__pattern {
    border-radius: 0;
    border-inline: 0;
  }
}

/* Revert footer visual constraint: full-width footer background */
.site-footer {
  background: #0a0a0a !important;
  border-top: 1px solid rgba(250,250,250,.1) !important;
  padding-inline: 0 !important;
}
.site-footer__pattern {
  width: auto !important;
  max-width: none !important;
  margin-inline: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(250,250,250,.1) !important;
  border-radius: 0 !important;
}
.site-footer__pattern > .site-shell {
  width: min(100%, var(--site-max-width)) !important;
  max-width: var(--site-max-width) !important;
  padding-inline: var(--site-pad-x) !important;
}

/* Hero media supports image or uploaded video */
.hero-screen__image video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


/* Features page section heading typography aligned with React */
.page-template-template-features .feature-detail-section .section-head {
  max-width: 1200px;
  margin-inline: auto;
  margin-bottom: 2.5rem;
  text-align: right !important;
}
.page-template-template-features .feature-detail-section .section-head h2 {
  margin: 0 0 1.25rem;
  color: var(--foreground);
  font-size: clamp(16px, 2.1vw, 22px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em;
  font-weight: 700 !important;
}
.page-template-template-features .feature-detail-section .section-head p {
  max-width: 760px;
  margin: 0;
  color: var(--muted-foreground);
  font-size: 0.9375rem !important;
  line-height: 1.65 !important;
  text-align: right !important;
}

/* Features page section head horizontal padding reset */
.page-template-template-features .feature-detail-section .section-head.center {
  padding-inline: 0 !important;
}

/* Revert features section head horizontal padding reset */
.page-template-template-features .feature-detail-section .section-head.center {
  padding-inline: initial !important;
}

/* Features page section title alignment without subtitle */
.page-template-template-features .feature-detail-section .section-head.center {
  max-width: none !important;
  margin-inline: 0 !important;
  padding-right: 0 !important;
  text-align: right !important;
}
.page-template-template-features .feature-detail-section .section-head h2 {
  margin-bottom: 0 !important;
}

/* Features complete hardcoded table */
.features-complete-table-section {
  padding-block: 7rem !important;
  background: #fff !important;
}
.features-complete-table-head {
  max-width: 780px;
  margin: 0 auto 4rem;
  text-align: center;
}
.features-complete-table-head span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: .25rem .75rem;
  color: var(--muted-foreground);
  font-size: .6875rem;
  font-weight: 500;
}
.features-complete-table-head h2 {
  margin: 0;
  color: var(--foreground);
  font-size: clamp(1.625rem, 3.5vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.features-complete-table-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: .75rem;
  background: var(--border);
}
.features-complete-table-grid article {
  min-height: 100%;
  background: var(--background);
  padding: 1.5rem;
}
.features-complete-table-grid h3 {
  margin: 0 0 1rem;
  color: var(--foreground);
  font-size: 1rem;
  line-height: 1.45;
  font-weight: 700;
}
.features-complete-table-grid ul {
  display: grid;
  gap: .7rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.features-complete-table-grid li {
  position: relative;
  padding-right: 1.35rem;
  color: var(--muted-foreground);
  font-size: .8125rem;
  line-height: 1.65;
}
.features-complete-table-grid li::before {
  content: '';
  position: absolute;
  right: 0;
  top: .6em;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(10,10,10,.45);
}
@media (max-width: 1024px) {
  .features-complete-table-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .features-complete-table-section {
    padding-block: 5rem !important;
  }
  .features-complete-table-grid {
    grid-template-columns: 1fr;
  }
}

/* Compact complete features table */
.features-complete-table-section {
  padding-block: 5.25rem !important;
}
.features-complete-table-head {
  margin-bottom: 2.5rem !important;
}
.features-complete-table-head span {
  margin-bottom: 1rem !important;
  padding: .22rem .65rem !important;
}
.features-complete-table-head h2 {
  font-size: clamp(1.5rem, 3vw, 2.15rem) !important;
}
.features-complete-table-grid article {
  padding: 1.15rem 1.25rem !important;
}
.features-complete-table-grid h3 {
  margin-bottom: .75rem !important;
  font-size: .9rem !important;
}
.features-complete-table-grid ul {
  gap: .45rem !important;
}
.features-complete-table-grid li {
  padding-right: 1.1rem !important;
  font-size: .78rem !important;
  line-height: 1.55 !important;
}
.features-complete-table-grid li::before {
  top: .58em !important;
  width: 5px !important;
  height: 5px !important;
}
@media (max-width: 680px) {
  .features-complete-table-section {
    padding-block: 4rem !important;
  }
}

/* Scope features sticky navigation to feature sections only */
.features-nav-scope {
  position: relative;
}

/* Revert complete features table compact overrides */
.features-complete-table-section {
  padding-block: 7rem !important;
}
.features-complete-table-head {
  margin-bottom: 4rem !important;
}
.features-complete-table-head span {
  margin-bottom: 1.5rem !important;
  padding: .25rem .75rem !important;
}
.features-complete-table-head h2 {
  font-size: clamp(1.625rem, 3.5vw, 2.5rem) !important;
}
.features-complete-table-grid article {
  padding: 1.5rem !important;
}
.features-complete-table-grid h3 {
  margin-bottom: 1rem !important;
  font-size: 1rem !important;
}
.features-complete-table-grid ul {
  gap: .7rem !important;
}
.features-complete-table-grid li {
  padding-right: 1.35rem !important;
  font-size: .8125rem !important;
  line-height: 1.65 !important;
}
.features-complete-table-grid li::before {
  top: .6em !important;
  width: 6px !important;
  height: 6px !important;
}
@media (max-width: 680px) {
  .features-complete-table-section {
    padding-block: 5rem !important;
  }
}

/* Features anchor selected state like top menu */
.features-anchor-nav a.is-active {
  color: var(--foreground) !important;
  background: rgba(244,244,245,.85) !important;
  font-weight: 800 !important;
}

/* Use cases archive aligned with React page */
.use-cases-react-archive {
  padding: 4rem 2rem !important;
  background: var(--background) !important;
}
.use-cases-react-archive .site-shell {
  max-width: 1400px;
}
.use-cases-react-archive .use-cases-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: stretch;
}
.use-cases-react-archive .use-case-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid var(--border);
  border-radius: .75rem;
  background: #fff;
  color: var(--foreground);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  cursor: pointer;
}
.use-cases-react-archive .use-case-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(0,0,0,.08);
  border-color: var(--border);
}
.use-cases-react-archive .use-case-card__media {
  position: relative;
  display: block;
  height: 16rem;
  border-bottom: 1px solid var(--border);
  background: #fff;
}
.use-cases-react-archive .use-case-card__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 0;
}
.use-cases-react-archive .use-case-card__body {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 1.5rem 1.75rem 1rem;
}
.use-cases-react-archive .use-case-card__body h2 {
  margin: 0;
  color: var(--foreground);
  font-size: 1.1875rem;
  line-height: 1.15;
  font-weight: 700;
}
.use-cases-react-archive .use-case-card__body p {
  min-height: 4.5rem;
  margin: .75rem 0 0;
  color: var(--muted-foreground);
  font-size: .9375rem;
  line-height: 1.65;
}
.use-cases-react-archive .use-case-card__eyebrow,
.use-cases-react-archive .use-case-card__link {
  display: none !important;
}
@media (max-width: 1180px) {
  .use-cases-react-archive .use-cases-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .use-cases-react-archive {
    padding-inline: 1.25rem !important;
  }
  .use-cases-react-archive .use-cases-grid {
    grid-template-columns: 1fr;
  }
  .use-cases-react-archive .use-case-card__media {
    height: 15rem;
  }
}

/* React-like single use case detail template */
.use-case-detail-hero {
  position: relative;
  overflow: hidden;
  padding: 4.5rem 2rem 6rem;
  border-bottom: 1px solid var(--border);
  background: var(--background);
}
.use-case-detail-hero__pattern {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(circle at 2px 2px, rgba(0,0,0,.10) 1px, transparent 1px);
  background-size: 22px 22px;
}
.use-case-detail-hero__inner {
  position: relative;
  max-width: 1200px;
  text-align: right;
}
.use-case-detail-hero .use-case-back {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: 2rem;
  color: var(--muted-foreground);
  font-size: .875rem;
  font-weight: 650;
}
.use-case-detail-hero .use-case-back::before { content: '→'; }
.use-case-detail-hero h1 {
  max-width: 920px;
  margin: 0;
  color: var(--foreground);
  font-size: clamp(3rem, 5vw, 3.25rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.use-case-detail-hero p {
  max-width: 780px;
  margin: 1.25rem 0 0;
  color: var(--muted-foreground);
  font-size: 1.1875rem;
  line-height: 1.7;
}
.use-case-detail-why,
.use-case-detail-workflow,
.use-case-detail-benefits {
  padding: 4rem 2rem;
}
.use-case-detail-why .site-shell,
.use-case-detail-workflow .site-shell,
.use-case-detail-benefits .site-shell,
.use-case-detail-cta .site-shell {
  max-width: 1200px;
}
.use-case-detail-section-head {
  margin-bottom: 2rem;
}
.use-case-detail-section-head--right { text-align: right; }
.use-case-detail-section-head--center { text-align: center; max-width: 820px; margin-inline: auto; }
.use-case-detail-section-head h2 {
  margin: 0 0 1rem;
  color: var(--foreground);
  font-size: clamp(1.875rem, 3.2vw, 2.5rem);
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.use-case-detail-section-head p {
  margin: 0;
  color: var(--muted-foreground);
  font-size: 1rem;
  line-height: 1.8;
}
.use-case-detail-why__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .92fr);
  gap: 2.5rem;
  align-items: stretch;
}
.use-case-detail-why__cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.use-case-detail-why__cards article,
.use-case-detail-benefits__grid article {
  border: 1px solid var(--border);
  border-radius: .75rem;
  background: #fff;
  padding: 1.5rem;
}
.use-case-detail-why__cards span,
.use-case-detail-benefits__grid span {
  width: 40px;
  height: 40px;
  margin-bottom: .75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .6rem;
  background: var(--secondary);
  color: var(--foreground);
}
.use-case-detail-why__cards h3,
.use-case-detail-benefits__grid h3 {
  margin: 0 0 .5rem;
  color: var(--foreground);
  font-size: 1.1875rem;
  line-height: 1.3;
  font-weight: 600;
}
.use-case-detail-why__cards p,
.use-case-detail-benefits__grid p {
  margin: 0;
  color: var(--muted-foreground);
  font-size: .875rem;
  line-height: 1.75;
}
.use-case-detail-why__image {
  min-height: 100%;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: var(--secondary);
}
.use-case-detail-why__image img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
}
.use-case-detail-workflow {
  border-top: 1px solid var(--border);
  background: var(--background);
}
.use-case-detail-workflow__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.use-case-detail-workflow__grid li {
  min-height: 100%;
  border-radius: .75rem;
  padding: 1.5rem;
  text-align: right;
}
.use-case-detail-workflow__grid span {
  width: 40px;
  height: 40px;
  margin-bottom: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(10,10,10,.10);
  color: var(--foreground);
  font-size: 1.0625rem;
  font-weight: 700;
}
.use-case-detail-workflow__grid h3 {
  margin: 0 0 .75rem;
  color: var(--foreground);
  font-size: 1.0625rem;
  font-weight: 600;
}
.use-case-detail-workflow__grid p {
  margin: 0;
  color: var(--muted-foreground);
  font-size: .9375rem;
  line-height: 1.65;
}
.use-case-detail-benefits {
  border-top: 1px solid var(--border);
}
.use-case-detail-benefits__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}
.use-case-detail-benefits__grid article {
  padding: 1.5rem;
}
.use-case-detail-cta {
  position: relative;
  overflow: hidden;
  padding: 5rem 2rem;
  border-top: 1px solid rgba(255,255,255,.1);
  background: rgba(10,10,10,.95);
  color: var(--background);
}
.use-case-detail-cta__pattern {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: radial-gradient(circle at 50% 50%, #000 0%, rgba(0,0,0,.7) 55%, rgba(0,0,0,.25) 85%, transparent 100%);
  -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 0%, rgba(0,0,0,.7) 55%, rgba(0,0,0,.25) 85%, transparent 100%);
}
.use-case-detail-cta__glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 75% 55% at 50% 12%, rgba(255,255,255,.12) 0%, transparent 72%);
}
.use-case-detail-cta__inner {
  position: relative;
  text-align: center;
}
.use-case-detail-cta h2 {
  margin: 0 0 1rem;
  color: var(--background);
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.2;
  font-weight: 700;
}
.use-case-detail-cta p {
  max-width: 760px;
  margin: 0 auto 2rem;
  color: rgba(250,250,250,.85);
  line-height: 1.8;
}
.use-case-detail-cta__inner > div {
  display: flex;
  justify-content: center;
  gap: .75rem;
  flex-wrap: wrap;
}
.use-case-detail-cta__primary { background: var(--background); color: var(--foreground); border-color: rgba(255,255,255,.3); }
.use-case-detail-cta__secondary { background: rgba(255,255,255,.1); color: var(--background); border-color: rgba(255,255,255,.3); }
@media (max-width: 1080px) {
  .use-case-detail-why__grid,
  .use-case-detail-workflow__grid {
    grid-template-columns: 1fr;
  }
  .use-case-detail-why__image img { max-height: 420px; }
}
@media (max-width: 720px) {
  .use-case-detail-hero,
  .use-case-detail-why,
  .use-case-detail-workflow,
  .use-case-detail-benefits,
  .use-case-detail-cta {
    padding-inline: 1.25rem;
  }
  .use-case-detail-why__cards,
  .use-case-detail-benefits__grid {
    grid-template-columns: 1fr;
  }
  .use-case-detail-cta__inner > div .btn { width: 100%; }
}

/* Global editable CTA section */
.booklio-cta-section {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: #121212;
    color: #fafafa;
    padding: clamp(4.5rem, 7vw, 6.25rem) 1.5rem;
}

.booklio-cta-section::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: radial-gradient(circle, rgba(255, 255, 255, .18) 1.15px, transparent 1.2px);
    background-size: 24px 24px;
    opacity: .85;
}

.booklio-cta-section::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, .08), transparent 34%),
        linear-gradient(90deg, rgba(0, 0, 0, .28), transparent 28%, transparent 72%, rgba(0, 0, 0, .28));
    pointer-events: none;
}

.booklio-cta-inner {
    max-width: 1040px;
    text-align: center;
}

.booklio-cta-inner h2 {
    margin: 0 0 1rem;
    color: #fafafa;
    font-size: clamp(1.875rem, 3.35vw, 2.75rem);
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -.04em;
}

.booklio-cta-inner p {
    max-width: 820px;
    margin: 0 auto 2rem;
    color: rgba(250, 250, 250, .66);
    font-size: clamp(.9rem, 1.05vw, 1rem);
    line-height: 1.9;
    font-weight: 500;
}

.booklio-cta-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.booklio-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.875rem;
    min-width: 10rem;
    padding: .625rem 1.25rem;
    border: 1px solid transparent;
    border-radius: .75rem;
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.booklio-cta-button:hover {
    transform: translateY(-1px);
}

.booklio-cta-button--primary {
    background: #ffffff;
    border-color: #ffffff;
    color: #111111;
}

.booklio-cta-button--primary:hover {
    background: rgba(255, 255, 255, .9);
    border-color: rgba(255, 255, 255, .9);
    color: #111111;
}

.booklio-cta-button--secondary {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .26);
    color: #fafafa;
}

.booklio-cta-button--secondary:hover {
    background: rgba(255, 255, 255, .13);
    border-color: rgba(255, 255, 255, .42);
    color: #fafafa;
}

@media (max-width: 640px) {
    .booklio-cta-section {
        padding: 4rem 1rem;
    }

    .booklio-cta-actions,
    .booklio-cta-button {
        width: 100%;
    }
}

/* Global compact button sizing */
:root {
    --booklio-button-height: 2.875rem;
    --booklio-button-font-size: .9375rem;
    --booklio-button-padding-x: 1.25rem;
}

.btn,
.wp-block-button__link,
.home-pricing-card__button,
.plans-card .btn,
.page-template-template-plans .pricing-card .btn,
.mobile-panel__actions .btn,
.header-actions .btn,
.contact-form-content .gform_button,
.contact-form-content input[type='submit'] {
    min-height: var(--booklio-button-height) !important;
    height: auto;
    padding-top: .625rem !important;
    padding-bottom: .625rem !important;
    padding-inline: var(--booklio-button-padding-x) !important;
    font-size: var(--booklio-button-font-size) !important;
    line-height: 1.15 !important;
}

.blog-search button,
.docs-home-search button {
    width: var(--booklio-button-height) !important;
    height: var(--booklio-button-height) !important;
    font-size: .95rem !important;
}

/* Compact home hero browser mockup chrome */
.home .hero-screen__bar {
    min-height: 2.75rem;
    padding: .55rem 1rem !important;
}

.home .hero-screen__bar div {
    display: none !important;
}

.home .hero-screen__bar span {
    width: 10px;
    height: 10px;
}

/* Compact top bar */
:root {
    --header-height: 72px;
}

.site-header__inner {
    min-height: var(--header-height) !important;
    padding-block: .55rem !important;
}

.site-nav a {
    min-height: 2.25rem !important;
    padding: .4rem .8rem !important;
    font-size: .875rem !important;
    font-weight: 650 !important;
}

.header-actions .btn {
    min-height: 2.375rem !important;
    padding: .5rem 1rem !important;
    font-size: .875rem !important;
    font-weight: 700 !important;
}

.mobile-toggle {
    width: 2.375rem !important;
    height: 2.375rem !important;
}

/* Home hero media should cover the browser mockup */
.home .hero-screen__image img,
.home .hero-screen__image video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

/* Plans page pricing cards and full comparison parity */
.page-template-template-plans .plans-pricing-grid {
    align-items: stretch;
}

.page-template-template-plans .plans-home-pricing-card {
    height: 100%;
}

.page-template-template-plans .plans-comparison-section {
    padding-block: clamp(5rem, 8vw, 8rem);
    background: var(--background);
}

.page-template-template-plans .plans-table-wrap {
    max-width: 1200px;
    margin: 3rem auto 0;
    border: 1px solid var(--border);
    border-radius: 22px;
    overflow-x: auto;
    overflow-y: visible;
    background: #fff;
    scrollbar-gutter: stable;
}

.page-template-template-plans .plans-comparison-table {
    width: 100%;
    min-width: 960px;
    border: 0;
    border-radius: 0;
    overflow: visible;
}

.page-template-template-plans .plans-comparison-table th,
.page-template-template-plans .plans-comparison-table td {
    padding: .9rem 1.05rem;
    font-size: .875rem;
    line-height: 1.75;
    border-bottom: 1px solid var(--border);
    white-space: normal;
    vertical-align: middle;
}

.page-template-template-plans .plans-comparison-table thead th {
    background: #fff;
    color: var(--foreground);
    font-weight: 850;
    box-shadow: none;
}

.page-template-template-plans .plans-comparison-table th:first-child,
.page-template-template-plans .plans-comparison-table td:first-child {
    width: 44%;
    min-width: 340px;
    text-align: right;
}

.page-template-template-plans .plans-comparison-table th:nth-child(n+2),
.page-template-template-plans .plans-comparison-table td:nth-child(n+2) {
    width: 18.666%;
    min-width: 150px;
    text-align: center;
}

.page-template-template-plans .plans-comparison-table tbody tr:not(.pricing-table__group):hover td {
    background: rgba(10, 10, 10, .075);
}

.page-template-template-plans .plans-comparison-table .pricing-table__group td {
    background: #cfcfcf;
    color: #111;
    font-size: .9rem;
    font-weight: 850;
    text-align: right !important;
    letter-spacing: -.01em;
}

.page-template-template-plans .plan-feature-label {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: rgba(10, 10, 10, .88);
    font-weight: 700;
}

.page-template-template-plans .plan-help {
    opacity: .55;
    transition: opacity .18s ease, background-color .18s ease, color .18s ease;
}

.page-template-template-plans tr:hover .plan-help,
.page-template-template-plans .plan-help:hover,
.page-template-template-plans .plan-help:focus-visible {
    opacity: 1;
}

.page-template-template-plans .plan-yes,
.page-template-template-plans .plan-no {
    background: transparent !important;
    width: 1.75rem !important;
    height: 1.75rem !important;
}

.page-template-template-plans .plan-yes .booklio-lucide {
    color: var(--foreground);
}

.page-template-template-plans .plan-no .booklio-lucide {
    color: rgba(10, 10, 10, .26);
}

@media (max-width: 760px) {
    .page-template-template-plans .plans-table-wrap {
        margin-top: 2rem;
        border-radius: 18px;
    }

    .page-template-template-plans .plans-comparison-table {
        min-width: 860px;
    }

    .page-template-template-plans .plans-comparison-table th,
    .page-template-template-plans .plans-comparison-table td {
        padding-inline: .85rem;
        font-size: .82rem;
    }
}

/* React-like plans comparison table polish */
.page-template-template-plans .plans-comparison-section .site-shell {
    max-width: 1200px;
}

.page-template-template-plans .plans-comparison-section .section-head {
    max-width: 760px;
    margin-inline: auto;
}

.page-template-template-plans .plans-table-wrap {
    overflow: visible;
    border-radius: 24px;
    border: 1px solid rgba(10, 10, 10, .1);
    box-shadow: 0 24px 70px rgba(10, 10, 10, .045);
}

.page-template-template-plans .plans-comparison-table {
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}

.page-template-template-plans .plans-comparison-table thead th {
    position: sticky;
    top: var(--header-height);
    z-index: 20;
    height: 4rem;
    background: rgba(255, 255, 255, .98);
    color: rgba(10, 10, 10, .9);
    border-bottom: 1px solid rgba(10, 10, 10, .14);
    backdrop-filter: blur(14px) saturate(150%);
    font-size: .9rem;
    font-weight: 850;
}

.page-template-template-plans .plans-comparison-table thead th:first-child {
    border-top-right-radius: 24px;
}

.page-template-template-plans .plans-comparison-table thead th:last-child {
    border-top-left-radius: 24px;
}

.page-template-template-plans .plans-comparison-table th:nth-child(3),
.page-template-template-plans .plans-comparison-table td:nth-child(3) {
    background: rgba(10, 10, 10, .028);
}

.page-template-template-plans .plans-comparison-table thead th:nth-child(3) {
    background: rgba(250, 250, 250, .98);
    color: #0a0a0a;
}

.page-template-template-plans .plans-comparison-table th,
.page-template-template-plans .plans-comparison-table td {
    border-left: 1px solid rgba(10, 10, 10, .075);
}

.page-template-template-plans .plans-comparison-table th:last-child,
.page-template-template-plans .plans-comparison-table td:last-child {
    border-left: 0;
}

.page-template-template-plans .plans-comparison-table tbody td {
    padding: .72rem 1rem;
    min-height: 3.25rem;
    color: rgba(10, 10, 10, .7);
    font-size: .86rem;
    font-weight: 600;
    transition: background-color .16s ease, color .16s ease;
}

.page-template-template-plans .plans-comparison-table tbody tr:not(.pricing-table__group):hover td {
    background: rgba(10, 10, 10, .09) !important;
    color: rgba(10, 10, 10, .92);
}

.page-template-template-plans .plans-comparison-table tbody tr:not(.pricing-table__group):hover td:nth-child(3) {
    background: rgba(10, 10, 10, .115) !important;
}

.page-template-template-plans .plans-comparison-table tbody tr:last-child td:first-child {
    border-bottom-right-radius: 24px;
}

.page-template-template-plans .plans-comparison-table tbody tr:last-child td:last-child {
    border-bottom-left-radius: 24px;
}

.page-template-template-plans .plans-comparison-table .pricing-table__group td {
    position: relative;
    padding: .64rem 1rem;
    background: #bdbdbd !important;
    color: #0a0a0a;
    border-left: 0;
    border-bottom-color: rgba(10, 10, 10, .16);
    font-size: .86rem;
    font-weight: 850;
    line-height: 1.5;
}

.page-template-template-plans .plans-comparison-table .pricing-table__group td::before {
    content: '';
    display: inline-block;
    width: .42rem;
    height: .42rem;
    margin-left: .55rem;
    border-radius: 999px;
    background: #0a0a0a;
    vertical-align: .08em;
    opacity: .78;
}

.page-template-template-plans .plans-comparison-table th:first-child,
.page-template-template-plans .plans-comparison-table td:first-child {
    width: 42%;
    min-width: 320px;
}

.page-template-template-plans .plans-comparison-table th:nth-child(n+2),
.page-template-template-plans .plans-comparison-table td:nth-child(n+2) {
    width: 19.333%;
    min-width: 138px;
}

.page-template-template-plans .plan-feature-label {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: .42rem;
    max-width: 100%;
    color: rgba(10, 10, 10, .9);
    font-size: .875rem;
    font-weight: 760;
    line-height: 1.65;
}

.page-template-template-plans .plan-help {
    position: relative;
    inset: auto;
    width: 1.15rem;
    height: 1.15rem;
    margin-top: 0;
    border: 1px solid rgba(10, 10, 10, .12);
    background: rgba(10, 10, 10, .035);
    color: rgba(10, 10, 10, .38);
    opacity: 0;
    cursor: help;
}

.page-template-template-plans .plan-help span {
    font-size: .68rem;
    font-weight: 850;
    transform: translateY(-.02rem);
}

.page-template-template-plans .plans-comparison-table tbody tr:hover .plan-help,
.page-template-template-plans .plan-help:hover,
.page-template-template-plans .plan-help:focus-visible {
    opacity: .72;
}

.page-template-template-plans .plan-help:hover,
.page-template-template-plans .plan-help:focus-visible {
    border-color: rgba(10, 10, 10, .2);
    background: rgba(10, 10, 10, .075);
    color: rgba(10, 10, 10, .62);
    opacity: 1;
}

.page-template-template-plans .plan-help em {
    right: 50%;
    bottom: calc(100% + .65rem);
    width: max-content;
    min-width: 230px;
    max-width: 300px;
    padding: .8rem .9rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 14px;
    background: rgba(17, 17, 17, .98);
    color: rgba(255, 255, 255, .88);
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.85;
    box-shadow: 0 22px 55px rgba(0, 0, 0, .22);
}

.page-template-template-plans .plan-help em::after {
    content: '';
    position: absolute;
    right: 50%;
    bottom: -.38rem;
    width: .75rem;
    height: .75rem;
    background: rgba(17, 17, 17, .98);
    transform: translateX(50%) rotate(45deg);
}

.page-template-template-plans .plan-yes,
.page-template-template-plans .plan-no {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 1.45rem !important;
    height: 1.45rem !important;
    margin-inline: auto;
    border-radius: 999px !important;
}

.page-template-template-plans .plan-yes .booklio-lucide,
.page-template-template-plans .plan-no .booklio-lucide {
    width: 1.05rem;
    height: 1.05rem;
    stroke-width: 2.45;
}

.page-template-template-plans .plan-yes .booklio-lucide {
    color: rgba(10, 10, 10, .92);
}

.page-template-template-plans .plan-no .booklio-lucide {
    color: rgba(10, 10, 10, .24);
}

@media (hover: none) {
    .page-template-template-plans .plan-help {
        opacity: .72;
    }

    .page-template-template-plans .plans-comparison-table tbody tr:hover td,
    .page-template-template-plans .plans-comparison-table tbody tr:hover td:nth-child(3) {
        background: inherit !important;
    }
}

@media (max-width: 900px) {
    .page-template-template-plans .plans-table-wrap {
        overflow-x: auto;
        overflow-y: visible;
        border-radius: 18px;
        box-shadow: none;
        -webkit-overflow-scrolling: touch;
    }

    .page-template-template-plans .plans-comparison-table {
        width: max-content;
        min-width: 760px;
        table-layout: auto;
    }

    .page-template-template-plans .plans-comparison-table thead th {
        top: var(--header-height);
        height: 3.5rem;
    }

    .page-template-template-plans .plans-comparison-table th:first-child,
    .page-template-template-plans .plans-comparison-table td:first-child {
        width: auto;
        min-width: 260px;
        max-width: 320px;
    }

    .page-template-template-plans .plans-comparison-table th:nth-child(n+2),
    .page-template-template-plans .plans-comparison-table td:nth-child(n+2) {
        width: auto;
        min-width: 112px;
    }

    .page-template-template-plans .plans-comparison-table th,
    .page-template-template-plans .plans-comparison-table td {
        padding-inline: .78rem;
    }

    .page-template-template-plans .plan-feature-label {
        font-size: .82rem;
        line-height: 1.6;
    }

    .page-template-template-plans .plan-help em {
        right: auto;
        left: -.2rem;
        transform: translateY(4px);
        min-width: 220px;
        max-width: 260px;
    }

    .page-template-template-plans .plan-help:hover em,
    .page-template-template-plans .plan-help:focus-visible em {
        transform: translateY(0);
    }

    .page-template-template-plans .plan-help em::after {
        right: auto;
        left: .7rem;
        transform: rotate(45deg);
    }
}

/* Plans comparison exact React parity override */
.page-template-template-plans .plans-comparison-section {
    padding-bottom: 8rem;
}

.page-template-template-plans .plans-table-wrap {
    max-width: 1050px !important;
    margin: 3rem auto 6rem !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    background: var(--background) !important;
    box-shadow: none !important;
    overflow: visible !important;
    scrollbar-gutter: auto !important;
}

.page-template-template-plans .plans-table-wrap > .plans-comparison-table,
.page-template-template-plans .plans-comparison-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-collapse: collapse !important;
    background: transparent !important;
}

.page-template-template-plans .plans-comparison-table thead {
    position: sticky;
    top: 73px;
    z-index: 50;
}

.page-template-template-plans .plans-comparison-table thead tr {
    border-bottom: 1px solid var(--border) !important;
    background: #fff !important;
}

.page-template-template-plans .plans-comparison-table thead th {
    position: sticky !important;
    top: 73px !important;
    z-index: 50 !important;
    height: auto !important;
    padding: 1rem 1.5rem !important;
    border: 0 !important;
    border-bottom: 1px solid var(--border) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--foreground) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
}

.page-template-template-plans .plans-comparison-table thead th:first-child {
    text-align: right !important;
}

.page-template-template-plans .plans-comparison-table thead th:nth-child(n+2) {
    width: 10rem !important;
    min-width: 10rem !important;
    text-align: center !important;
}

.page-template-template-plans .plans-comparison-table th,
.page-template-template-plans .plans-comparison-table td {
    border-left: 0 !important;
}

.page-template-template-plans .plans-comparison-table tbody tr {
    border-bottom: 1px solid var(--border) !important;
}

.page-template-template-plans .plans-comparison-table tbody tr:last-child {
    border-bottom: 0 !important;
}

.page-template-template-plans .plans-comparison-table tbody td {
    padding: 1rem 1.5rem !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--foreground) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    min-height: 0 !important;
    white-space: normal !important;
}

.page-template-template-plans .plans-comparison-table tbody td:nth-child(n+2) {
    text-align: center !important;
}

.page-template-template-plans .plans-comparison-table tbody td:nth-child(3) {
    background: rgba(244, 244, 245, .3) !important;
}

.page-template-template-plans .plans-comparison-table tbody tr:not(.pricing-table__group):hover td {
    background: rgba(244, 244, 245, .6) !important;
}

.page-template-template-plans .plans-comparison-table tbody tr:not(.pricing-table__group):hover td:nth-child(3) {
    background: rgba(244, 244, 245, .72) !important;
}

.page-template-template-plans .plans-comparison-table .pricing-table__group {
    border-bottom: 0 !important;
}

.page-template-template-plans .plans-comparison-table .pricing-table__group td {
    padding: .75rem 1.5rem !important;
    border: 0 !important;
    background: rgba(244, 244, 245, .8) !important;
    color: var(--foreground) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    text-align: right !important;
}

.page-template-template-plans .plans-comparison-table .pricing-table__group td::before {
    content: none !important;
}

.page-template-template-plans .plan-feature-label {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .5rem !important;
    color: var(--foreground) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

.page-template-template-plans .plan-help {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 1rem !important;
    height: 1rem !important;
    min-width: 1rem !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: rgba(95, 95, 95, .6) !important;
    opacity: 0 !important;
    padding: 0 !important;
    transition: opacity .2s ease, color .2s ease !important;
}

.page-template-template-plans .plans-comparison-table tbody tr:hover .plan-help,
.page-template-template-plans .plan-help:hover,
.page-template-template-plans .plan-help:focus-visible {
    opacity: 1 !important;
}

.page-template-template-plans .plan-help span {
    width: 1rem !important;
    height: 1rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: .72rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.page-template-template-plans .plan-help em {
    right: 0 !important;
    top: 100% !important;
    bottom: auto !important;
    margin-top: .5rem !important;
    min-width: 14rem !important;
    max-width: 18rem !important;
    width: max-content !important;
    padding: .5rem .75rem !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    background: var(--background) !important;
    color: var(--foreground) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.8 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .12) !important;
    transform: translateY(4px) !important;
}

.page-template-template-plans .plan-help:hover em,
.page-template-template-plans .plan-help:focus-visible em {
    transform: translateY(0) !important;
}

.page-template-template-plans .plan-help em::after {
    content: none !important;
}

.page-template-template-plans .plan-yes,
.page-template-template-plans .plan-no {
    width: 1.25rem !important;
    height: 1.25rem !important;
    margin-inline: auto !important;
    background: transparent !important;
}

.page-template-template-plans .plan-yes .booklio-lucide,
.page-template-template-plans .plan-no .booklio-lucide {
    width: 1.25rem !important;
    height: 1.25rem !important;
    stroke-width: 2 !important;
}

.page-template-template-plans .plan-yes .booklio-lucide {
    color: var(--foreground) !important;
}

.page-template-template-plans .plan-no .booklio-lucide {
    color: rgba(95, 95, 95, .3) !important;
}

@media (hover: none) {
    .page-template-template-plans .plan-help {
        opacity: 1 !important;
    }
}

@media (max-width: 767px) {
    .page-template-template-plans .plans-table-wrap {
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch;
    }

    .page-template-template-plans .plans-comparison-table {
        width: max-content !important;
        min-width: 760px !important;
    }

    .page-template-template-plans .plans-comparison-table thead th,
    .page-template-template-plans .plans-comparison-table tbody td,
    .page-template-template-plans .plans-comparison-table .pricing-table__group td {
        padding-inline: 1rem !important;
    }

    .page-template-template-plans .plans-comparison-table thead th:nth-child(n+2) {
        width: auto !important;
        min-width: 8rem !important;
    }
}

/* Plans comparison sticky header and visible rounded border */
.page-template-template-plans .plans-table-wrap {
    position: relative !important;
    border-color: transparent !important;
}

.page-template-template-plans .plans-table-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 70;
    pointer-events: none;
    border: 1px solid var(--border);
    border-radius: 12px;
}

.page-template-template-plans .plans-comparison-table thead,
.page-template-template-plans .plans-comparison-table thead tr,
.page-template-template-plans .plans-comparison-table thead th {
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
}

.page-template-template-plans .plans-comparison-table thead th {
    background-clip: padding-box !important;
}

@media (max-width: 1024px) {
    .page-template-template-plans .plans-table-wrap {
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        contain: paint !important;
        -webkit-overflow-scrolling: touch;
    }
}

/* Documentation center polish */
.docs-home {
    padding-top: clamp(4.5rem, 7vw, 6.5rem);
}

.docs-home .site-shell,
.docs-page-section .site-shell {
    max-width: 1200px;
}

.docs-home-grid {
    gap: 1.25rem;
}

.docs-category-card {
    position: relative;
    border-radius: 18px;
    padding: 1.35rem 1.4rem;
    box-shadow: none;
}

.docs-category-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 34px rgba(10, 10, 10, .045);
}

.docs-category-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .85rem;
}

.docs-category-card__top h2 {
    margin: 0;
    font-size: 1.08rem;
    line-height: 1.5;
    font-weight: 850;
}

.docs-category-card__top span {
    flex: 0 0 auto;
    color: rgba(10, 10, 10, .48);
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.8;
}

.docs-category-card p {
    margin-bottom: 1.1rem;
    font-size: .9rem;
    line-height: 1.85;
}

.docs-category-card ul {
    gap: .35rem;
}

.docs-category-card li a {
    display: block;
    color: rgba(10, 10, 10, .66);
    font-size: .86rem;
    line-height: 1.8;
}

.docs-category-card li a:hover {
    color: var(--foreground);
}

.docs-category-card__more {
    margin-top: 1.1rem;
    font-size: .84rem;
    font-weight: 850;
}

.docs-layout {
    grid-template-columns: 280px minmax(0, 1fr) !important;
    gap: clamp(2.25rem, 4vw, 4.5rem) !important;
}

.docs-sidebar {
    top: calc(var(--header-height) + 2rem);
    border-left: 1px solid rgba(10, 10, 10, .1);
    padding-left: 1.25rem;
}

.docs-sidebar__form {
    position: relative;
    margin-bottom: 1.6rem;
}

.docs-sidebar__search {
    min-height: 2.875rem;
    border-radius: 12px;
    padding: 0 1rem 0 2.8rem !important;
    font-size: .86rem;
}

.docs-sidebar__form button {
    position: absolute;
    left: .35rem;
    top: 50%;
    transform: translateY(-50%);
    width: 2.15rem;
    height: 2.15rem;
    border: 0;
    border-radius: 9px;
    background: var(--foreground);
    color: var(--background);
    cursor: pointer;
}

.docs-menu {
    gap: .35rem;
}

.docs-menu__group {
    padding-bottom: .55rem;
    border-bottom: 1px solid rgba(10, 10, 10, .09);
}

.docs-menu__group summary {
    min-height: 2.2rem;
}

.docs-menu__section {
    font-size: .93rem !important;
    font-weight: 850 !important;
    line-height: 1.7;
}

.docs-menu__group summary span {
    font-size: .92rem;
    color: rgba(10, 10, 10, .42);
}

.docs-menu ul {
    overflow: hidden;
    margin-top: .35rem;
    gap: .1rem;
}

.docs-menu ul a {
    padding: .22rem 0;
    color: rgba(10, 10, 10, .56);
    font-size: .86rem;
    font-weight: 500;
    line-height: 1.85;
}

.docs-menu ul a:hover,
.docs-menu ul a.is-active {
    color: var(--foreground);
    font-weight: 800;
}

.docs-content-header {
    margin-bottom: 2.25rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(10, 10, 10, .08);
}

.docs-content-header h1 {
    max-width: 820px;
    font-size: clamp(2rem, 3.5vw, 3rem);
    line-height: 1.28;
    font-weight: 900;
}

.docs-content-header p {
    max-width: 780px;
    font-size: .98rem;
    line-height: 1.9;
}

.docs-article-meta {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    margin-top: 1.1rem;
    color: rgba(10, 10, 10, .48);
    font-size: .82rem;
    font-weight: 700;
}

.docs-article-meta span + span::before {
    content: '';
    display: inline-block;
    width: .25rem;
    height: .25rem;
    margin-left: .75rem;
    border-radius: 999px;
    background: rgba(10, 10, 10, .28);
    vertical-align: middle;
}

.docs-list-grid {
    grid-template-columns: 1fr;
    gap: .85rem;
}

.docs-list-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    background: #fff;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.docs-list-card:hover {
    border-color: rgba(10, 10, 10, .2);
    background: rgba(250, 250, 250, .75);
    transform: translateY(-1px);
}

.docs-list-card__link {
    display: block;
    padding: 1.15rem 1.25rem;
}

.docs-list-card__eyebrow {
    display: block;
    margin-bottom: .45rem;
    color: rgba(10, 10, 10, .45);
    font-size: .76rem;
    font-weight: 800;
}

.docs-list-card h2 {
    margin: 0;
    color: var(--foreground);
    font-size: 1.02rem;
    line-height: 1.65;
    font-weight: 850;
}

.docs-list-card p {
    margin: .5rem 0 0;
    color: rgba(10, 10, 10, .58);
    font-size: .9rem;
    line-height: 1.85;
}

.docs-article-content {
    max-width: 820px;
    background: transparent !important;
}

.docs-article-content h2,
.docs-article-content h3,
.docs-article-content h4 {
    scroll-margin-top: calc(var(--header-height) + 1.5rem);
}

.docs-article-content h2 {
    margin-top: 2.4rem;
    padding-top: 1.6rem;
    border-top: 1px solid rgba(10, 10, 10, .08);
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.55;
}

.docs-article-content h3 {
    margin-top: 2rem;
    font-size: 1.2rem;
    line-height: 1.65;
}

.docs-article-content p,
.docs-article-content li {
    color: rgba(10, 10, 10, .9);
    font-size: 1rem;
    line-height: 2.05;
}

.docs-article-content ul,
.docs-article-content ol {
    padding-right: 1.35rem;
}

.docs-article-content pre,
.docs-article-content code {
    direction: ltr;
    text-align: left;
}

.docs-article-content pre {
    overflow-x: auto;
    border: 1px solid rgba(10, 10, 10, .1);
    border-radius: 14px;
    background: #111;
    color: #f7f7f7;
    padding: 1rem 1.1rem;
}

.docs-article-content table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
}

.docs-article-content th,
.docs-article-content td {
    border-bottom: 1px solid var(--border);
    padding: .8rem .9rem;
    text-align: right;
}

body.single-booklio_doc .docs-article-content .wp-block-table,
body.single-post .blog-article__content .wp-block-table {
    margin: 1.5rem 0;
    border: 1px solid rgba(10, 10, 10, .1);
    border-radius: 16px;
    background: #fff;
    overflow-x: auto;
    overflow-y: hidden;
}

body.single-booklio_doc .docs-article-content .wp-block-table table,
body.single-post .blog-article__content .wp-block-table table {
    width: 100%;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
}

body.single-booklio_doc .docs-article-content .wp-block-table th,
body.single-booklio_doc .docs-article-content .wp-block-table td,
body.single-post .blog-article__content .wp-block-table th,
body.single-post .blog-article__content .wp-block-table td {
    padding: .9rem 1rem;
    border: 0;
    border-bottom: 1px solid rgba(10, 10, 10, .1);
    border-inline-start: 1px solid rgba(10, 10, 10, .1);
    text-align: right;
    vertical-align: top;
    color: inherit;
    background: #fff;
    font-size: 14px;
    line-height: 1.95;
}

body.single-booklio_doc .docs-article-content .wp-block-table th,
body.single-post .blog-article__content .wp-block-table th {
    background: rgba(244, 244, 245, .72);
    font-weight: 700;
}

body.single-booklio_doc .docs-article-content .wp-block-table tr > :first-child,
body.single-post .blog-article__content .wp-block-table tr > :first-child {
    border-inline-start: 0;
}

body.single-booklio_doc .docs-article-content .wp-block-table tbody tr:last-child td,
body.single-post .blog-article__content .wp-block-table tbody tr:last-child td {
    border-bottom: 0;
}

body.single-booklio_doc .docs-article-content .wp-block-table code,
body.single-post .blog-article__content .wp-block-table code {
    font-size: .94em;
}

.docs-article-content blockquote {
    margin: 1.5rem 0;
    border-right: 3px solid var(--foreground);
    border-left: 0;
    border-radius: 12px;
    background: rgba(244, 244, 245, .75);
    padding: 1rem 1.25rem;
    color: rgba(10, 10, 10, .72);
}

@media (max-width: 1024px) {
    .docs-layout {
        grid-template-columns: 1fr !important;
    }

    .docs-sidebar {
        position: static;
        border-left: 0;
        padding-left: 0;
    }
}

@media (max-width: 720px) {
    .docs-category-grid {
        grid-template-columns: 1fr;
    }

    .docs-content-header h1 {
        font-size: clamp(1.75rem, 9vw, 2.4rem);
    }
}

/* Align documentation pages with the global page container width */
.docs-home .site-shell,
.docs-page-section .site-shell {
    max-width: 1400px !important;
}

.docs-article-content {
    max-width: 900px;
}

/* Documentation search icon alignment */
.docs-home-search button,
.docs-sidebar__form button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
}

.docs-home-search button .booklio-lucide,
.docs-sidebar__form button .booklio-lucide {
    width: 1rem;
    height: 1rem;
    stroke-width: 2.25;
}

/* Refined documentation search fields */
.docs-home-search input,
.docs-sidebar__search,
.docs-search-results .docs-home-search input {
    min-height: 3rem !important;
    border-radius: 14px !important;
    padding-right: 1rem !important;
    padding-left: 3rem !important;
    background: #fff !important;
    font-size: .9rem !important;
}

.docs-home-search button,
.docs-sidebar__form button,
.docs-search-results .docs-home-search button {
    left: .55rem !important;
    width: 2rem !important;
    height: 2rem !important;
    min-height: 2rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: rgba(10, 10, 10, .5) !important;
    box-shadow: none !important;
    transition: color .18s ease, background-color .18s ease !important;
}

.docs-home-search button:hover,
.docs-sidebar__form button:hover,
.docs-search-results .docs-home-search button:hover,
.docs-home-search input:focus + input + button,
.docs-sidebar__search:focus + input + button {
    background: rgba(10, 10, 10, .055) !important;
    color: var(--foreground) !important;
}

.docs-home-search button .booklio-lucide,
.docs-sidebar__form button .booklio-lucide,
.docs-search-results .docs-home-search button .booklio-lucide {
    width: .95rem !important;
    height: .95rem !important;
    stroke-width: 2.1 !important;
}

/* Match sidebar docs search focus with main docs search */
.docs-sidebar__search:focus {
    border-color: rgba(10, 10, 10, .35) !important;
    box-shadow: 0 0 0 4px rgba(10, 10, 10, .045) !important;
    outline: none !important;
}

.docs-sidebar__form:focus-within button {
    background: rgba(10, 10, 10, .055) !important;
    color: var(--foreground) !important;
}

.docs-home-search:focus-within button,
.docs-search-results .docs-home-search:focus-within button {
    background: rgba(10, 10, 10, .055) !important;
    color: var(--foreground) !important;
}

/* Docs sidebar accordion refinement */
.docs-menu__chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    color: rgba(10, 10, 10, .42);
    transition: transform .24s ease, color .2s ease;
}

.docs-menu__chevron .booklio-lucide {
    width: 1rem;
    height: 1rem;
    stroke-width: 2.15;
}

.docs-menu__group[open] .docs-menu__chevron {
    transform: rotate(180deg);
    color: rgba(10, 10, 10, .72);
}

.docs-menu__group summary span:not(.docs-menu__chevron) {
    transform: none !important;
}

.docs-menu__group ul {
    animation: docsAccordionOpen .22s ease both;
    transform-origin: top right;
}

@keyframes docsAccordionOpen {
    from {
        opacity: 0;
        transform: translateY(-4px) scaleY(.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scaleY(1);
    }
}

/* Softer docs sidebar item hover and active weight */
.docs-menu ul a:hover,
.docs-menu ul a.is-active {
    font-weight: 650 !important;
}

/* Match inner page hero title scale with home hero */
.hero h1,
.docs-content-header h1 {
    font-size: clamp(3rem, 4.35vw, 3.25rem) !important;
    line-height: 1.3 !important;
    letter-spacing: -.045em !important;
    font-weight: 950 !important;
}

.hero p {
    font-size: clamp(1.08rem, 1.7vw, 1.25rem) !important;
    line-height: 1.85 !important;
}

@media (max-width: 760px) {
    .hero h1,
    .docs-content-header h1 {
        font-size: clamp(2.25rem, 10vw, 3.2rem) !important;
    }
}

/* Make home hero badge match inner breadcrumb scale */
.home-hero__tag {
    margin-bottom: 1rem !important;
}

.home-hero__tag span {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    color: var(--muted-foreground) !important;
    font-size: .78rem !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
    backdrop-filter: none !important;
}

/* Home hero breadcrumb-style badge */
.home-hero__breadcrumb {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .85rem !important;
    margin: 0 auto 1.5rem !important;
    padding: .7rem 1.45rem !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .78) !important;
    color: var(--foreground) !important;
    box-shadow: 0 12px 30px rgba(10, 10, 10, .035) !important;
    backdrop-filter: blur(12px) !important;
}

.home-hero__breadcrumb span,
.home-hero__breadcrumb strong {
    display: inline-flex !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: .95rem !important;
    line-height: 1.4 !important;
    letter-spacing: -.015em !important;
    backdrop-filter: none !important;
}

.home-hero__breadcrumb span {
    color: rgba(10, 10, 10, .5) !important;
    font-weight: 500 !important;
}

.home-hero__breadcrumb strong {
    color: var(--foreground) !important;
    font-weight: 800 !important;
}

.home-hero__breadcrumb b {
    color: rgba(10, 10, 10, .42) !important;
    font-size: .95rem !important;
    line-height: 1 !important;
    font-weight: 400 !important;
}

/* Home hero badge uses the exact inner-page breadcrumb visual system */
.home-hero .home-hero__badge {
    margin: 0 auto 1.5rem !important;
}

.home-hero .home-hero__badge ol {
    padding: .35rem .75rem !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.7) !important;
    backdrop-filter: blur(10px) !important;
    box-shadow: none !important;
}

.home-hero .home-hero__badge li,
.home-hero .home-hero__badge span {
    color: var(--foreground) !important;
    font-size: .78rem !important;
    font-weight: 400 !important;
    line-height: normal !important;
}

/* Keep home hero badge centered and identical to inner breadcrumbs */
.home-hero .home-hero__badge {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: fit-content !important;
    margin-inline: auto !important;
    margin-bottom: 1.5rem !important;
}

.home-hero .home-hero__badge ol {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 2.125rem !important;
    padding: .35rem .75rem !important;
}

.home-hero .home-hero__badge li,
.home-hero .home-hero__badge span {
    display: inline-flex !important;
    align-items: center !important;
    font-size: .78rem !important;
    line-height: 1 !important;
}

/* Unified section heading scale */
.section-head h2,
.home-section-head-large h2,
.problem-solution-head h2,
.dark-section-head h2,
.home-faq-heading h2 {
    font-size: 2.8rem !important;
    line-height: 1.3 !important;
}

.section-head p,
.home-section-head-large p,
.problem-solution-head p,
.dark-section-head p,
.home-faq-heading p {
    font-size: 1rem !important;
    line-height: 1.85 !important;
}

@media (max-width: 760px) {
    .section-head h2,
    .home-section-head-large h2,
    .problem-solution-head h2,
    .dark-section-head h2,
    .home-faq-heading h2 {
        font-size: clamp(2rem, 9vw, 2.8rem) !important;
    }
}

/* Explicit home section heading scale for key sections */
.feature-tiles-section .section-head h2,
.react-usecases-section .section-head h2,
.comparison-section .section-head h2,
.guided-setup-dark .section-head h2,
.plans-section .section-head h2 {
    font-size: 2.8rem !important;
    line-height: 1.3 !important;
    font-weight: 850 !important;
}

.feature-tiles-section .section-head p,
.react-usecases-section .section-head p,
.comparison-section .section-head p,
.guided-setup-dark .section-head p,
.plans-section .section-head p {
    font-size: 1rem !important;
    line-height: 1.85 !important;
}

/* Guided setup kicker readability and badge parity */
.guided-setup-dark .guided-kicker {
    display: flex !important;
    justify-content: center !important;
    margin: 0 auto 1.5rem !important;
}

.guided-setup-dark .guided-kicker span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 2.125rem !important;
    padding: .35rem .75rem !important;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .92) !important;
    color: #111 !important;
    font-size: .78rem !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    backdrop-filter: blur(10px) !important;
}

@media (max-width: 760px) {
    .feature-tiles-section .section-head h2,
    .react-usecases-section .section-head h2,
    .comparison-section .section-head h2,
    .guided-setup-dark .section-head h2,
    .plans-section .section-head h2 {
        font-size: clamp(2rem, 9vw, 2.8rem) !important;
    }
}

/* Smooth home FAQ accordion */
.home-faq-item {
    overflow: hidden;
}

.home-faq-item p {
    transition: opacity .24s ease, transform .24s ease;
}

.home-faq-item:not([open]) p {
    opacity: 0;
    transform: translateY(-4px);
}

.home-faq-item[open] p {
    opacity: 1;
    transform: translateY(0);
}

/* Guided setup kicker as outline on dark background */
.guided-setup-dark .guided-kicker span {
    background: transparent !important;
    color: rgba(250, 250, 250, .88) !important;
    border-color: rgba(255, 255, 255, .28) !important;
    backdrop-filter: none !important;
}

/* Blog section polish */
.blog-index .site-shell,
.archive-index .site-shell,
.blog-single .site-shell,
.related-posts-section .site-shell {
    max-width: 1400px;
}

.blog-layout {
    grid-template-columns: 280px minmax(0, 1fr) !important;
    gap: clamp(2.25rem, 4vw, 4.5rem) !important;
}

.blog-sidebar {
    top: calc(var(--header-height) + 2rem);
    gap: 1.6rem;
}

.blog-search input {
    min-height: 3rem !important;
    border-radius: 14px !important;
    padding-right: 1rem !important;
    padding-left: 3rem !important;
    background: #fff !important;
    font-size: .9rem !important;
}

.blog-search button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    left: .55rem !important;
    width: 2rem !important;
    height: 2rem !important;
    min-height: 2rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: rgba(10, 10, 10, .5) !important;
    font-size: 0 !important;
    box-shadow: none !important;
}

.blog-search button .booklio-lucide {
    width: .95rem !important;
    height: .95rem !important;
    stroke-width: 2.1 !important;
}

.blog-search:focus-within button,
.blog-search button:hover {
    background: rgba(10, 10, 10, .055) !important;
    color: var(--foreground) !important;
}

.blog-filter-block {
    padding-top: 1.35rem;
}

.blog-filter-block h2 {
    font-size: .92rem;
    font-weight: 850;
}

.blog-filter-list a {
    min-height: 2.35rem;
    padding-inline: .55rem;
    font-size: .88rem;
}

.blog-filter-list a:hover,
.blog-filter-list a.is-active {
    color: var(--foreground);
    background: rgba(244, 244, 245, .85);
    padding-inline: .55rem;
}

.archive-index .blog-filter-list a.is-active,
.archive-index .tag-cloud a.is-active {
    background: var(--foreground) !important;
    color: var(--background) !important;
    border-color: var(--foreground) !important;
}

.tag-cloud a,
.blog-share-row__tags a {
    min-height: 2rem;
    font-size: .8rem;
    font-weight: 650;
}

.blog-card-grid {
    gap: 1.25rem;
}

.post-card {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: none;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.post-card:hover {
    border-color: rgba(10, 10, 10, .2);
    transform: translateY(-1px);
    box-shadow: 0 14px 34px rgba(10, 10, 10, .045);
}

.post-card__body h2 {
    font-size: 1.08rem;
    line-height: 1.65;
    font-weight: 850;
}

.post-card__body p {
    color: rgba(10, 10, 10, .58);
    font-size: .92rem;
    line-height: 1.85;
}

.post-card__category {
    display: inline-flex;
    align-items: center;
    gap: .32rem;
}

.post-card__category::before {
    content: none !important;
}

.post-card__category .booklio-lucide {
    width: .9rem;
    height: .9rem;
    color: rgba(10, 10, 10, .46);
    stroke-width: 2;
}

.blog-single__shell {
    max-width: 1040px;
}

.blog-article__header h1 {
    font-size: clamp(3rem, 4.35vw, 3.25rem) !important;
    line-height: 1.3 !important;
}

.blog-article__content {
    max-width: 900px;
}

.blog-article__content h2 {
    margin-top: 2.4rem;
    padding-top: 1.4rem;
    border-top: 1px solid rgba(10, 10, 10, .08);
}

.related-posts-section .section-head {
    max-width: 900px;
    margin-inline: auto;
}

.related-posts-grid {
    max-width: 900px;
    margin-inline: auto;
}

.related-post-card a {
    min-height: 6rem;
    font-size: 1rem;
    font-weight: 800;
}

@media (max-width: 1024px) {
    .blog-layout {
        grid-template-columns: 1fr !important;
    }

    .blog-sidebar {
        position: static;
    }
}

/* Blog single page hero and icon-only sharing */
.single-post .blog-post-hero + .blog-single {
    padding-top: clamp(3.5rem, 6vw, 5.5rem);
}

.single-post .blog-article__header {
    margin-bottom: 2rem;
}

.single-post .blog-article__category {
    margin-bottom: 1rem;
}

.single-post .blog-article__media {
    margin-bottom: 2rem;
}

.single-post .blog-share-row__links a {
    width: 2.5rem;
    min-width: 2.5rem;
    height: 2.5rem;
    min-height: 2.5rem;
    padding: 0;
    font-size: 0;
}

.single-post .blog-share-row__links a .booklio-lucide {
    width: 1rem;
    height: 1rem;
    stroke-width: 2.1;
}

.single-post .related-posts-section {
    border-top: 1px solid var(--border);
    background: var(--background);
}

/* Blog post hero meta under title */
.single-post .blog-post-hero .hero__inner > p {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    max-width: none;
    color: rgba(10, 10, 10, .58) !important;
    font-size: .95rem !important;
    font-weight: 650;
    line-height: 1.6 !important;
}

.single-post .blog-post-hero .hero__inner > p::first-letter {
    color: inherit;
}

.single-post .blog-article__header {
    display: none;
}

/* Global page loading, transitions, and section reveal */
.booklio-js:not(.booklio-page-ready) .site-main {
    opacity: 0;
    transform: translateY(8px);
}

.booklio-js.booklio-page-ready .site-main {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 420ms ease, transform 520ms cubic-bezier(.22, 1, .36, 1);
}

.booklio-js.booklio-page-leaving .site-main,
.booklio-js.booklio-page-leaving .site-footer {
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 160ms ease, transform 160ms ease;
}

.booklio-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 680ms ease var(--booklio-reveal-delay, 0ms), transform 760ms cubic-bezier(.22, 1, .36, 1) var(--booklio-reveal-delay, 0ms);
    will-change: opacity, transform;
}

.booklio-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .booklio-js:not(.booklio-page-ready) .site-main,
    .booklio-js.booklio-page-ready .site-main,
    .booklio-js.booklio-page-leaving .site-main,
    .booklio-js.booklio-page-leaving .site-footer,
    .booklio-reveal,
    .booklio-reveal.is-visible {
        opacity: 1;
        transform: none;
        transition: none;
    }

}

/* Performance and accessibility polish */
.site-footer h4,
.site-footer__title {
    margin: 0 0 1.25rem;
    font-size: .75rem;
    color: rgba(250,250,250,.35);
    letter-spacing: .1em;
    font-weight: 800;
}

.comparison-note {
    color: rgba(10,10,10,.68) !important;
}

/* Responsive safety for plans comparison table */
@media (max-width: 1024px) {
    .page-template-template-plans .plans-table-wrap {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        contain: paint !important;
        -webkit-overflow-scrolling: touch;
    }

    .page-template-template-plans .plans-comparison-table thead,
    .page-template-template-plans .plans-comparison-table thead tr,
    .page-template-template-plans .plans-comparison-table thead th {
        position: static !important;
        top: auto !important;
        z-index: auto !important;
        box-shadow: none !important;
        transform: none !important;
    }
}

/* Mobile vertical rhythm tightening */
@media (max-width: 720px) {
    .hero,
    .hero--compact,
    .page-template-template-contact .hero,
    .page-template-template-about .hero,
    .post-type-archive-booklio_feature .hero--compact {
        padding-top: 2.75rem !important;
        padding-bottom: 3rem !important;
    }

    .home-hero {
        padding-top: 3rem !important;
        padding-bottom: 3.25rem !important;
    }

    .hero h1 {
        margin-bottom: 1rem !important;
        font-size: clamp(1.75rem, 9.8vw, 2.45rem) !important;
        line-height: 1.12 !important;
    }

    .hero p {
        font-size: clamp(.95rem, 4.3vw, 1.08rem) !important;
        line-height: 1.8 !important;
    }

    .breadcrumbs {
        margin-bottom: 1.65rem !important;
    }

    .section,
    .trust-card-section,
    .problem-solution-section,
    .dark-flow-section,
    .feature-tiles-section,
    .react-usecases-section,
    .comparison-section,
    .plans-section,
    .home-faq-section,
    .features-complete-table-section,
    .plans-pricing-section,
    .plans-comparison-section,
    .docs-page-section,
    .use-cases-react-archive,
    .blog-index-section,
    .contact-page-section,
    .legal-page-section {
        padding-top: 3.25rem !important;
        padding-bottom: 3.25rem !important;
    }

    .section-head,
    .section-head.center,
    .use-cases-archive .section-head,
    .plans-section .section-head,
    .features-complete-table-head {
        margin-bottom: 2rem !important;
    }

    .contact-page-section {
        margin-top: -1.75rem !important;
    }

    .back-to-top {
        display: none !important;
    }

    .booklio-reveal,
    .booklio-reveal.is-visible {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }
}

/* Mobile/tablet plans comparison: framed horizontal table with sticky column headers */
@media (max-width: 1024px) {
    .page-template-template-plans .plans-table-wrap {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: auto !important;
        border: 1px solid var(--border) !important;
        border-radius: 18px !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        contain: none !important;
        background: #fff !important;
        -webkit-overflow-scrolling: touch;
    }

    .page-template-template-plans .plans-table-wrap::after {
        content: none !important;
    }

    .page-template-template-plans .plans-comparison-table {
        width: max-content !important;
        min-width: 680px !important;
        border: 0 !important;
        border-radius: 0 !important;
        overflow: visible !important;
    }

    .page-template-template-plans .plans-comparison-table thead,
    .page-template-template-plans .plans-comparison-table thead tr {
        position: static !important;
        transform: none !important;
    }

    .page-template-template-plans .plans-comparison-table thead th {
        position: sticky !important;
        top: var(--header-height) !important;
        z-index: 80 !important;
        background: #fff !important;
        background-color: #fff !important;
        box-shadow: 0 1px 0 var(--border), 0 10px 18px rgba(10, 10, 10, .04) !important;
    }
}

@media (max-width: 720px) {
    .page-template-template-plans .plans-comparison-section .site-shell {
        padding-inline: var(--site-pad-x) !important;
    }

    .page-template-template-plans .plans-table-wrap {
        border-radius: 16px !important;
    }

    .page-template-template-plans .plans-comparison-table {
        min-width: 640px !important;
    }

    .page-template-template-plans .plans-comparison-table th,
    .page-template-template-plans .plans-comparison-table td,
    .page-template-template-plans .plans-comparison-table .pricing-table__group td {
        padding-inline: .9rem !important;
    }
}

@media (max-width: 1024px) {
    .page-template-template-plans .plans-comparison-table thead,
    .page-template-template-plans .plans-comparison-table thead tr,
    .page-template-template-plans .plans-comparison-table thead th {
        position: static !important;
        top: auto !important;
        z-index: auto !important;
        box-shadow: none !important;
    }
}

/* Final responsive table alignment */
@media (max-width: 1024px) {
    .page-template-template-plans .plans-comparison-table {
        table-layout: fixed !important;
        width: 640px !important;
        min-width: 640px !important;
        max-width: none !important;
    }

    .page-template-template-plans .plans-comparison-table th,
    .page-template-template-plans .plans-comparison-table td {
        box-sizing: border-box !important;
        vertical-align: middle !important;
    }

    .page-template-template-plans .plans-comparison-table th:first-child,
    .page-template-template-plans .plans-comparison-table td:first-child {
        width: 280px !important;
        min-width: 280px !important;
        max-width: 280px !important;
    }

    .page-template-template-plans .plans-comparison-table th:nth-child(n+2),
    .page-template-template-plans .plans-comparison-table td:nth-child(n+2) {
        width: 120px !important;
        min-width: 120px !important;
        max-width: 120px !important;
        text-align: center !important;
    }

    .page-template-template-plans .plans-comparison-table thead th {
        position: sticky !important;
        top: var(--header-height) !important;
        z-index: 30 !important;
        background: #fff !important;
        box-shadow: 0 1px 0 var(--border), 0 10px 18px rgba(10, 10, 10, .04) !important;
    }
}

/* Mobile card view for plan comparison */
.plans-mobile-comparison {
    display: none;
}

@media (max-width: 720px) {
    .page-template-template-plans .plans-table-wrap {
        display: none !important;
    }

    .plans-mobile-comparison {
        display: grid;
        gap: 1.25rem;
        margin-top: 2rem;
        overflow: visible;
    }

    .plans-mobile-comparison__group {
        display: grid;
        gap: .75rem;
        overflow: visible;
    }

    .plans-mobile-comparison__group h3 {
        margin: 0;
        border-radius: 14px;
        background: rgba(10, 10, 10, .08);
        padding: .75rem 1rem;
        color: var(--foreground);
        font-size: .95rem;
        font-weight: 850;
    }

    .plans-mobile-comparison__items {
        display: grid;
        gap: .75rem;
        overflow: visible;
    }

    .plans-mobile-feature {
        position: relative;
        border: 1px solid var(--border);
        border-radius: 16px;
        background: #fff;
        overflow: visible;
    }

    .plans-mobile-feature__head {
        display: flex;
        position: relative;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        padding: .85rem 1rem;
        border-bottom: 1px solid var(--border);
        background: rgba(250, 250, 250, .78);
    }

    .plans-mobile-feature__head strong {
        font-size: .98rem;
        line-height: 1.65;
        font-weight: 800;
    }

    .plans-mobile-feature__plans {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin: 0;
    }

    .plans-mobile-feature__plans div {
        display: grid;
        align-content: center;
        justify-items: center;
        gap: .45rem;
        min-height: 5.1rem;
        padding: .8rem .45rem;
        border-inline-start: 1px solid var(--border);
    }

    .plans-mobile-feature__plans div:first-child {
        border-inline-start: 0;
    }

    .plans-mobile-feature__plans dt {
        color: rgba(10, 10, 10, .52);
        font-size: .75rem;
        font-weight: 800;
    }

    .plans-mobile-feature__plans dd {
        margin: 0;
        color: var(--foreground);
        font-size: .9rem;
        font-weight: 800;
        line-height: 1.55;
        text-align: center;
        word-break: keep-all;
    }

    .plans-mobile-feature .plan-help {
        position: static;
        opacity: .68;
    }

    .plans-mobile-feature .plan-help em {
        left: 1rem !important;
        right: 1rem !important;
        top: calc(100% + .55rem) !important;
        bottom: auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        transform: translateY(4px) !important;
        z-index: 200;
    }

    .plans-mobile-feature:has(.plan-help:hover),
    .plans-mobile-feature:has(.plan-help:focus-visible) {
        z-index: 30;
    }

    .plans-mobile-feature .plan-help:hover em,
    .plans-mobile-feature .plan-help:focus-visible em {
        transform: translateY(0) !important;
    }
}

/* Compact feature anchor navigation */
.features-anchor-nav {
  background: rgba(250, 250, 250, .98);
  box-shadow: 0 1px 0 rgba(10, 10, 10, .04);
}
.features-anchor-nav .site-shell {
  gap: .32rem;
  padding-block: .5rem;
  scroll-padding-inline: var(--site-pad-x);
  -webkit-overflow-scrolling: touch;
}
.features-anchor-nav a {
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .38rem .72rem;
  font-size: .82rem;
  font-weight: 750;
}
.features-anchor-nav a.is-active {
  background: var(--foreground);
  color: var(--background);
}

@media (max-width: 680px) {
  .features-anchor-nav .site-shell {
    gap: .28rem;
    padding-block: .42rem;
    scroll-snap-type: x proximity;
  }
  .features-anchor-nav a {
    min-height: 1.9rem;
    padding: .32rem .64rem;
    font-size: .78rem;
    scroll-snap-align: center;
  }
}


.home-pricing-card__button.is-disabled {
  cursor: default;
  pointer-events: none;
  opacity: .72;
}
.home-pricing-card__button.is-disabled:hover {
  transform: none;
}

/* Mobile horizontal overflow guard */
@media (max-width: 782px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  .site-header,
  .mobile-panel {
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .site-main,
  .site-footer,
  .section,
  .hero,
  .home-hero,
  .site-shell {
    max-width: 100% !important;
  }

  .site-shell {
    width: 100% !important;
  }

  .alignfull {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  img,
  video,
  iframe,
  svg {
    max-width: 100%;
  }
}

@supports not (overflow: clip) {
  @media (max-width: 782px) {
    html,
    body {
      overflow-x: hidden;
    }
  }
}

/* Home mobile overflow hard guard */
@media (max-width: 782px) {
  body.home {
    position: relative;
    inline-size: 100%;
    max-inline-size: 100%;
    overflow-x: hidden !important;
  }

  body.home .site-header {
    inline-size: 100vw !important;
    max-inline-size: 100vw !important;
    overflow-x: clip !important;
  }

  body.home .site-main,
  body.home .home-hero,
  body.home .home-hero__inner,
  body.home .home-hero__copy,
  body.home .home-marquee,
  body.home .hero-screen,
  body.home .trust-card-grid,
  body.home .problem-solution-grid,
  body.home .dark-flow-grid,
  body.home .feature-tile-rows,
  body.home .react-usecase-grid,
  body.home .comparison-shell,
  body.home .home-pricing-cards,
  body.home .purchase-notes,
  body.home .home-faq-grid {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    margin-inline-start: auto !important;
    margin-inline-end: auto !important;
  }

  body.home .home-hero,
  body.home .home-marquee,
  body.home .hero-screen {
    overflow-x: hidden !important;
  }

  body.home .home-marquee__track {
    max-inline-size: none !important;
    min-inline-size: max-content !important;
    will-change: transform;
  }

  body.home .home-hero__copy h1,
  body.home .home-hero__copy p,
  body.home .section-head,
  body.home .section-head h2,
  body.home .section-head p {
    max-inline-size: 100% !important;
    overflow-wrap: anywhere;
  }

  body.home .hero-screen {
    margin-inline: 0 !important;
  }
}

/* Mobile menu page overlay */
.mobile-menu-overlay {
  display: none;
}

@media (max-width: 1024px) {
  .mobile-menu-overlay {
    position: fixed;
    inset: var(--header-height) 0 0 0;
    z-index: 998;
    width: 100%;
    min-height: calc(100dvh - var(--header-height));
    border: 0;
    padding: 0;
    margin: 0;
    background: rgba(10, 10, 10, .42);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    cursor: pointer;
    transition: opacity .22s ease;
  }

  .site-header.is-open .mobile-menu-overlay {
    display: block;
    opacity: 1;
  }

  .mobile-menu-overlay[hidden] {
    display: none !important;
  }

  .mobile-panel {
    z-index: 1001;
  }

  .site-header__inner {
    position: relative;
    z-index: 1002;
  }
}

/* Mobile menu overlay placement refinement */
@media (max-width: 1024px) {
  .site-header.is-open {
    background: #fff !important;
  }

  .site-header.is-open .mobile-panel {
    background: #fff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .site-header.is-open .mobile-menu-overlay {
    top: calc(var(--header-height) + var(--booklio-mobile-panel-height, 0px)) !important;
    inset-inline: 0 !important;
    bottom: 0 !important;
    min-height: auto !important;
    background: rgba(10, 10, 10, .48) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
  }
}

/* Mobile menu modal-style backdrop */
@media (max-width: 1024px) {
  .site-header.is-open {
    background: #fff !important;
  }

  .site-header.is-open .mobile-menu-overlay {
    position: fixed !important;
    top: var(--header-height) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 998 !important;
    display: block !important;
    width: 100% !important;
    min-height: auto !important;
    background: rgba(10, 10, 10, .18) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    opacity: 1 !important;
  }

  .site-header.is-open .mobile-panel {
    position: absolute !important;
    z-index: 1001 !important;
    background: #fff !important;
    box-shadow: 0 22px 60px rgba(10, 10, 10, .08) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .site-header.is-open .site-header__inner {
    background: #fff !important;
  }

  .mobile-menu-overlay[hidden] {
    display: none !important;
  }
}

/* Mobile menu backdrop height fix */
@media (max-width: 1024px) {
  .site-header.is-open .mobile-menu-overlay {
    top: var(--header-height) !important;
    bottom: auto !important;
    height: calc(100dvh - var(--header-height)) !important;
    min-height: calc(100vh - var(--header-height)) !important;
  }
}

/* Mobile menu backdrop final sizing fix */
@media (max-width: 1024px) {
  .site-header.is-open .mobile-menu-overlay {
    position: fixed !important;
    top: var(--header-height) !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 998 !important;
    display: block !important;
    width: 100% !important;
    height: calc(100dvh - var(--header-height)) !important;
    min-height: calc(100vh - var(--header-height)) !important;
    max-height: none !important;
    background: rgba(10, 10, 10, .22) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
  }
}

/* Smooth mobile menu opening */
@media (max-width: 1024px) {
  .mobile-menu-overlay:not([hidden]) {
    display: block !important;
    opacity: 0;
  }

  .mobile-panel:not([hidden]) {
    display: block;
  }

  .mobile-panel {
    opacity: 0;
    transform: translateY(-10px) scale(.985);
    transform-origin: top center;
    pointer-events: none;
    transition: opacity .24s ease, transform .3s cubic-bezier(.22, 1, .36, 1);
    will-change: opacity, transform;
  }

  .site-header.is-open .mobile-panel {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
  }
}

/* Mobile menu opens with a light top slide; closing is instant via JS hidden state. */
@media (max-width: 1024px) {
  .mobile-panel {
    opacity: 0;
    transform: translateY(-18px);
    transform-origin: top center;
    pointer-events: none;
    transition: opacity .18s ease, transform .26s cubic-bezier(.22, 1, .36, 1);
    will-change: opacity, transform;
  }

  .site-header.is-open .mobile-panel {
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
  }
}

/* Use case SEO guide is available without overwhelming the page. */
.use-case-seo-content {
  padding-top: 1rem;
}

.use-case-seo-content__details {
  max-width: 980px;
  margin-inline: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
  text-align: center;
}

.use-case-seo-content__details summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  cursor: pointer;
  padding: .2rem .45rem;
  font-size: .78rem;
  line-height: 1.7;
  font-weight: 500;
  color: rgba(10, 10, 10, .28);
  list-style: none;
  border-radius: 999px;
  outline: none;
  transition: color .2s ease, background-color .2s ease;
}

.use-case-seo-content__details summary:hover {
  color: rgba(10, 10, 10, .42);
}

.use-case-seo-content__details summary:focus-visible {
  color: rgba(10, 10, 10, .46);
  background: rgba(10, 10, 10, .035);
}

.use-case-seo-content__details summary::-webkit-details-marker {
  display: none;
}

.use-case-seo-content__details summary::after {
  content: '+';
  color: rgba(10, 10, 10, .26);
  font-weight: 700;
  font-size: .75rem;
}

.use-case-seo-content__details[open] summary {
  margin-bottom: .75rem;
}

.use-case-seo-content__details[open] summary::after {
  content: '-';
}

.use-case-seo-content__body {
  padding: 1.5rem 1.35rem 1.8rem;
  text-align: right;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
}


.wp-content .booklio-callout,
.content-wrap .booklio-callout {
  --callout-bg: #f8fafc;
  --callout-border: #cbd5e1;
  --callout-text: #334155;
  --callout-icon-bg: rgba(255, 255, 255, .48);
  --callout-icon: #475569;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .65rem;
  align-items: flex-start;
  margin: 1rem 0;
  padding: .85rem .95rem;
  border: 1px solid var(--callout-border);
  border-radius: 8px;
  background: var(--callout-bg);
  color: var(--callout-text);
  box-shadow: none;
}

.wp-content .booklio-callout__icon,
.content-wrap .booklio-callout__icon {
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--callout-icon-bg);
  color: var(--callout-icon);
  box-shadow: none;
}

.wp-content .booklio-callout__icon-svg,
.content-wrap .booklio-callout__icon-svg {
  width: .95rem;
  height: .95rem;
}

.wp-content .booklio-callout__content,
.content-wrap .booklio-callout__content {
  min-width: 0;
}

.wp-content .booklio-callout__title,
.content-wrap .booklio-callout__title {
  margin-bottom: .2rem;
  font-size: 14px;
  line-height: 1.9;
  font-weight: 700;
  color: var(--callout-text);
}

.wp-content .booklio-callout__text,
.content-wrap .booklio-callout__text {
  font-size: 14px;
  line-height: 2;
  font-weight: 500;
  color: var(--callout-text);
}

.wp-content .booklio-callout__text > :first-child,
.content-wrap .booklio-callout__text > :first-child {
  margin-top: 0;
}

.wp-content .booklio-callout__text > :last-child,
.content-wrap .booklio-callout__text > :last-child {
  margin-bottom: 0;
}

.booklio-callout--success {
  --callout-bg: rgba(25, 135, 84, .1);
  --callout-border: #badbcc;
  --callout-text: #0f5132;
  --callout-icon-bg: rgba(15, 81, 50, .08);
  --callout-icon: #0f5132;
}

.booklio-callout--warning {
  --callout-bg: rgba(255, 193, 7, .1);
  --callout-border: #ffecb5;
  --callout-text: #664d03;
  --callout-icon-bg: rgba(102, 77, 3, .08);
  --callout-icon: #664d03;
}

.booklio-callout--danger {
  --callout-bg: rgba(220, 53, 69, .1);
  --callout-border: #f5c2c7;
  --callout-text: #842029;
  --callout-icon-bg: rgba(132, 32, 41, .08);
  --callout-icon: #842029;
}

.booklio-callout--info {
  --callout-bg: rgba(13, 202, 240, .1);
  --callout-border: #b6effb;
  --callout-text: #055160;
  --callout-icon-bg: rgba(5, 81, 96, .08);
  --callout-icon: #055160;
}

.booklio-callout--note {
  --callout-bg: rgba(108, 117, 125, .1);
  --callout-border: #d3d6d8;
  --callout-text: #41464b;
  --callout-icon-bg: rgba(65, 70, 75, .08);
  --callout-icon: #41464b;
}

.booklio-callout--tip {
  --callout-bg: rgba(13, 110, 253, .1);
  --callout-border: #b6d4fe;
  --callout-text: #084298;
  --callout-icon-bg: rgba(8, 66, 152, .08);
  --callout-icon: #084298;
}

@media (max-width: 640px) {
  .wp-content .booklio-callout,
  .content-wrap .booklio-callout {
    gap: .55rem;
    padding: .75rem .8rem;
    border-radius: 8px;
  }
}


.wp-content .booklio-callout.booklio-callout--success,
.content-wrap .booklio-callout.booklio-callout--success {
  --callout-bg: rgba(25, 135, 84, .1);
  --callout-border: #badbcc;
  --callout-text: #0f5132;
  --callout-icon-bg: rgba(15, 81, 50, .08);
  --callout-icon: #0f5132;
}

.wp-content .booklio-callout.booklio-callout--warning,
.content-wrap .booklio-callout.booklio-callout--warning {
  --callout-bg: rgba(255, 193, 7, .1);
  --callout-border: #ffecb5;
  --callout-text: #664d03;
  --callout-icon-bg: rgba(102, 77, 3, .08);
  --callout-icon: #664d03;
}

.wp-content .booklio-callout.booklio-callout--danger,
.content-wrap .booklio-callout.booklio-callout--danger {
  --callout-bg: rgba(220, 53, 69, .1);
  --callout-border: #f5c2c7;
  --callout-text: #842029;
  --callout-icon-bg: rgba(132, 32, 41, .08);
  --callout-icon: #842029;
}

.wp-content .booklio-callout.booklio-callout--info,
.content-wrap .booklio-callout.booklio-callout--info {
  --callout-bg: rgba(13, 202, 240, .1);
  --callout-border: #b6effb;
  --callout-text: #055160;
  --callout-icon-bg: rgba(5, 81, 96, .08);
  --callout-icon: #055160;
}

.wp-content .booklio-callout.booklio-callout--note,
.content-wrap .booklio-callout.booklio-callout--note {
  --callout-bg: rgba(108, 117, 125, .1);
  --callout-border: #d3d6d8;
  --callout-text: #41464b;
  --callout-icon-bg: rgba(65, 70, 75, .08);
  --callout-icon: #41464b;
}

.wp-content .booklio-callout.booklio-callout--tip,
.content-wrap .booklio-callout.booklio-callout--tip {
  --callout-bg: rgba(13, 110, 253, .1);
  --callout-border: #b6d4fe;
  --callout-text: #084298;
  --callout-icon-bg: rgba(8, 66, 152, .08);
  --callout-icon: #084298;
}


.wp-content .booklio-callout__text,
.wp-content .booklio-callout__text p,
.wp-content .booklio-callout__text li,
.content-wrap .booklio-callout__text,
.content-wrap .booklio-callout__text p,
.content-wrap .booklio-callout__text li {
  font-size: 14px;
  line-height: 2;
  font-weight: 500;
}


/* Smaller hero and documentation titles */
.hero h1,
.docs-content-header h1 {
  font-size: clamp(1.8rem, 2.6vw, 1.95rem) !important;
  line-height: 1.35 !important;
}

@media (max-width: 760px) {
  .hero h1,
  .docs-content-header h1 {
    font-size: clamp(1.55rem, 6vw, 1.95rem) !important;
  }
}


.docs-article-content code {
  font-family: inherit !important;
  font-weight: 600 !important;
  padding: 0 4px;
}

/* booklio-hero-title-hotfix */
@media (min-width: 761px) {
    .hero h1,
    .use-case-hero h1,
    .use-case-detail-hero h1 {
        font-size: 3.25rem !important;
    }
}

/* booklio-disable-reveal-hotfix */
.booklio-js:not(.booklio-page-ready) .site-main,
.booklio-js.booklio-page-ready .site-main,
.booklio-js.booklio-page-leaving .site-main,
.booklio-js.booklio-page-leaving .site-footer,
.booklio-reveal,
.booklio-reveal.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
}

/* booklio-content-image-frame-hotfix */
.docs-page-section .wp-content img,
.blog-article__content img {
    border: 1px solid #eee !important;
    border-radius: 12px !important;
}

/* booklio-docs-sidebar-weight-hotfix */
.docs-menu ul a,
.docs-menu ul a:hover,
.docs-menu ul a.is-active {
    font-weight: 500 !important;
}

/* booklio-docs-mobile-sidebar-restore */
.docs-sidebar__toggle,
.docs-sidebar__overlay,
.docs-sidebar__panel-header,
.docs-sidebar__close {
    display: none;
}

@media (max-width: 1024px) {
    .docs-layout {
        gap: 1.25rem !important;
    }

    .docs-sidebar {
        position: static !important;
        top: auto !important;
        z-index: 8;
        margin-bottom: .2rem;
        border-left: 0 !important;
        padding-left: 0 !important;
    }

    .docs-sidebar__mobile-bar {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: .75rem;
        margin-bottom: .35rem;
    }

    .docs-sidebar__mobile-bar .docs-sidebar__form {
        margin: 0;
    }

    .docs-sidebar__mobile-bar .docs-sidebar__search {
        min-height: 2.8rem !important;
        padding-left: 2.7rem !important;
        font-size: .84rem !important;
    }

    .docs-sidebar__mobile-bar .docs-sidebar__toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .45rem;
        min-height: 2.8rem;
        padding: 0 1rem;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #fff;
        color: var(--foreground);
        font-size: .95rem;
        font-weight: 800;
        box-shadow: none;
        cursor: pointer;
        white-space: nowrap;
    }

    .docs-sidebar__toggle-icon,
    .docs-sidebar__close,
    .docs-sidebar__close .booklio-lucide,
    .docs-sidebar__toggle .booklio-lucide {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .docs-sidebar__toggle-icon {
        width: 1rem;
        height: 1rem;
        transition: transform .22s ease;
    }

    .docs-sidebar.is-open .docs-sidebar__toggle-icon {
        transform: rotate(180deg);
    }

    .docs-sidebar__overlay {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1300;
        border: 0;
        background: rgba(250, 250, 250, .8);
        backdrop-filter: blur(3px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .22s ease, visibility .22s ease;
    }

    .docs-sidebar__panel {
        position: fixed;
        inset: 0;
        z-index: 1305;
        overflow-y: auto;
        padding: 1rem 1.15rem 1.5rem;
        background: #fff;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(10px);
        transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
    }

    .docs-sidebar.is-open .docs-sidebar__overlay,
    .docs-sidebar.is-open .docs-sidebar__panel {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }

    .docs-sidebar__panel-header {
        display: flex;
        position: sticky;
        top: 0;
        z-index: 2;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        margin: -.15rem 0 1rem;
        padding: .15rem 0 1rem;
        background: #fff;
        border-bottom: 1px solid rgba(10, 10, 10, .08);
    }

    .docs-sidebar__panel-title {
        font-size: 1.55rem;
        line-height: 1.35;
        font-weight: 900;
    }

    .docs-sidebar__close {
        width: 3rem;
        height: 3rem;
        border: 1px solid var(--border);
        border-radius: 14px;
        background: #fff;
        color: var(--foreground);
        cursor: pointer;
        box-shadow: none;
        flex: 0 0 auto;
    }

    .docs-sidebar__close .booklio-lucide,
    .docs-sidebar__toggle .booklio-lucide {
        width: 1rem;
        height: 1rem;
        stroke-width: 2.2;
    }

    .docs-sidebar__panel .docs-menu {
        gap: .2rem;
    }

    .docs-sidebar__panel .docs-menu__group {
        padding-bottom: .75rem;
    }

    .docs-sidebar__panel .docs-menu__group summary {
        min-height: 2.85rem;
    }

    .docs-sidebar__panel .docs-menu ul {
        margin-top: .5rem;
    }

    .docs-sidebar__panel .docs-menu ul a {
        padding: .3rem 0;
        font-size: .98rem;
        line-height: 1.95;
    }

    html.has-docs-sidebar-panel,
    html.has-docs-sidebar-panel body {
        overflow: hidden;
    }

    body.single-booklio_doc .docs-content-header .breadcrumbs,
    body.tax-booklio_doc_category .docs-content-header .breadcrumbs {
        display: flex;
        width: 100%;
        margin-bottom: .9rem;
    }

    body.single-booklio_doc .docs-content-header .breadcrumbs ol,
    body.tax-booklio_doc_category .docs-content-header .breadcrumbs ol {
        width: 100%;
        justify-content: flex-start;
        padding-inline: .7rem;
    }

    body.single-booklio_doc .docs-content-header .breadcrumbs li:last-child,
    body.tax-booklio_doc_category .docs-content-header .breadcrumbs li:last-child {
        display: none;
    }

    body.single-booklio_doc .docs-content-header .breadcrumbs li:nth-last-child(2)::after,
    body.tax-booklio_doc_category .docs-content-header .breadcrumbs li:nth-last-child(2)::after {
        display: none;
    }
}

@media (max-width: 720px) {
    .docs-content-header h1 {
        font-size: clamp(1.75rem, 7vw, 2.15rem) !important;
    }

    .docs-sidebar__mobile-bar {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .55rem;
    }

    .docs-sidebar__mobile-bar .docs-sidebar__toggle {
        min-width: 8rem;
        padding-inline: .9rem;
    }
}

/* booklio-blog-post-hero-restore */
.single-post .blog-post-hero .hero__inner {
    max-width: 840px;
    margin-inline: auto;
}

.single-post .blog-post-hero h1 {
    font-size: clamp(2.1rem, 3.2vw, 2.35rem) !important;
    line-height: 1.32 !important;
    font-weight: 800 !important;
    letter-spacing: -.03em !important;
}

.single-post .blog-post-hero .hero__inner > p {
    font-size: .95rem !important;
}

.single-post .blog-article__media {
    max-width: 900px;
    margin: 0 auto 2rem;
    border: 1px solid #eee;
    border-radius: 12px;
    background: #fff;
    box-shadow: none !important;
    overflow: hidden;
}

.single-post .blog-article__media img {
    width: 100%;
    max-height: none;
    height: auto;
    object-fit: contain;
}

@media (max-width: 760px) {
    .single-post .blog-post-hero .hero__inner {
        max-width: 100%;
    }

    .single-post .blog-post-hero h1 {
        font-size: clamp(1.85rem, 6.6vw, 2.15rem) !important;
    }
}

body.single-post .blog-article__content a:not(.wp-block-button__link),
body.single-booklio_doc .docs-article-content a:not(.wp-block-button__link) {
    color: #2563eb;
    text-decoration: none;
    transition: color .2s ease;
}

body.single-post .blog-article__content a:not(.wp-block-button__link):hover,
body.single-post .blog-article__content a:not(.wp-block-button__link):focus-visible,
body.single-booklio_doc .docs-article-content a:not(.wp-block-button__link):hover,
body.single-booklio_doc .docs-article-content a:not(.wp-block-button__link):focus-visible {
    color: #1d4ed8;
    text-decoration: none;
}

/* Blog archive mobile order */
@media (max-width: 1024px) {
    body.blog .blog-posts-area,
    body.archive .archive-index .blog-posts-area {
        order: 1;
    }

    body.blog .blog-sidebar,
body.archive .archive-index .blog-sidebar {
        order: 2;
    }
}

/* Floating promotional banner */
.floating-promo {
    position: fixed;
    top: calc(var(--header-height) + 1rem);
    left: 1rem;
    z-index: 1200;
    width: min(23rem, calc(100vw - 2rem));
    display: grid;
    grid-template-columns: 5.25rem minmax(0, 1fr);
    gap: .9rem;
    padding: .85rem;
    border: 1px solid rgba(229, 229, 229, .95);
    border-radius: 18px;
    background: rgba(255, 255, 255, .96);
    color: var(--foreground);
    box-shadow: 0 22px 55px rgba(10, 10, 10, .11), 0 1px 0 rgba(255, 255, 255, .86) inset;
    backdrop-filter: blur(18px) saturate(145%);
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    opacity: 0;
    transform: translateY(-8px) scale(.98);
    pointer-events: none;
    transition: opacity .22s ease, transform .24s cubic-bezier(.16, 1, .3, 1);
}

.floating-promo.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.floating-promo.is-hiding {
    opacity: 0;
    transform: translateY(-6px) scale(.98);
    pointer-events: none;
}

.floating-promo__close {
    position: absolute;
    top: .55rem;
    left: .55rem;
    z-index: 2;
    width: 1.85rem;
    height: 1.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(229, 229, 229, .95);
    border-radius: 10px;
    background: rgba(255, 255, 255, .92);
    color: rgba(10, 10, 10, .68);
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease, transform .18s ease;
}

.floating-promo__close:hover {
    background: var(--secondary);
    color: var(--foreground);
    transform: translateY(-1px);
}

.floating-promo__media {
    margin: 0;
    align-self: stretch;
    min-height: 5.25rem;
    border-radius: 14px;
    overflow: hidden;
    background: var(--secondary);
}

.floating-promo__media img {
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
}

.floating-promo__content {
    min-width: 0;
    padding-left: 2rem;
}

.floating-promo__content strong {
    display: block;
    margin-bottom: .25rem;
    font-size: .98rem;
    line-height: 1.55;
    font-weight: 900;
    letter-spacing: -.015em;
}

.floating-promo__content p {
    margin: 0;
    color: rgba(10, 10, 10, .58);
    font-size: .82rem;
    line-height: 1.8;
}

.floating-promo__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-top: .75rem;
}

.floating-promo__actions .btn {
    min-height: 2.25rem;
    padding: .48rem .75rem;
    border-radius: 10px;
    font-size: .78rem;
    font-weight: 850;
}

@media (max-width: 760px) {
    .floating-promo {
        top: calc(var(--header-height) + .75rem);
        left: 1rem;
        right: 1rem;
        width: auto;
        grid-template-columns: 4.6rem minmax(0, 1fr);
        gap: .75rem;
        padding: .75rem;
        border-radius: 16px;
    }

    .floating-promo__media {
        min-height: 4.6rem;
        border-radius: 12px;
    }

    .floating-promo__content {
        padding-left: 1.85rem;
    }

    .floating-promo__content strong {
        font-size: .9rem;
        line-height: 1.5;
    }

    .floating-promo__content p {
        font-size: .78rem;
        line-height: 1.7;
    }

    .floating-promo__actions .btn {
        min-height: 2.15rem;
        padding-inline: .68rem;
        font-size: .74rem;
    }
}