
:root{--bg:#f7f8fb;--panel:#ffffff;--text:#162033;--muted:#667085;--line:#e7eaf0;--accent:#1d4ed8;--accent-text:#ffffff;--header-bg:#0b1220;--header-text:#ffffff;--footer-bg:#ffffff;--footer-text:#667085;--max:1120px;--article:820px;--gutter:24px;--section-gap:48px;--content-pad:40px;--r-sm:10px;--r-card:18px;--r-section:22px;--r-button:9px;--r-image:16px;--shadow:0 8px 24px rgba(16,24,40,.05)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.68 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.wrap{max-width:var(--max);margin:auto;padding:0 var(--gutter)}
.top{background:var(--header-bg);color:var(--header-text);position:relative;top:0;z-index:30}.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:68px}.brand{font-weight:800;color:var(--header-text);font-size:19px}.nav{display:flex;gap:18px;flex-wrap:wrap}.nav a{color:var(--header-text);opacity:.9;font-size:14px}
.hero{padding:72px 0 48px;background:linear-gradient(180deg,var(--panel),transparent)}.hero h1,.block-hero h1{font-size:clamp(34px,6vw,54px);line-height:1.05;letter-spacing:-0.02em;margin:0 0 18px;max-width:900px;font-weight:800}.hero p,.block-hero p{max-width:760px;color:var(--muted);font-size:20px}
.section,.builder-block{padding:var(--section-gap) 0}.section-title{font-size:32px;letter-spacing:-.02em;margin:0 0 24px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--shadow)}.card img{width:100%;height:200px;object-fit:cover;display:block}.card-body{padding:22px}.card h2,.card h3{margin:0 0 8px;line-height:1.25}.card p{color:var(--muted);margin:0}
.article{max-width:var(--article);margin:38px auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-section);padding:var(--content-pad);box-shadow:var(--shadow)}.article.custom-layout{max-width:none;margin:0;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}.article h1{font-size:clamp(34px,5vw,54px);line-height:1.08;letter-spacing:-.035em;margin:0 0 16px}.article h2,.builder-block h2{margin-top:0;font-size:32px;line-height:1.2}.article h3,.builder-block h3{font-size:23px}.article p{font-size:18px}.article li{margin:.45rem 0}.lede{font-size:20px!important;color:var(--muted)}.hero-img,.block-image img,.block-gallery img{width:100%;object-fit:cover;border-radius:var(--r-image);display:block}
.pill{display:inline-flex;padding:6px 10px;background:color-mix(in srgb,var(--accent) 12%,white);color:var(--accent);border-radius:999px;font-size:12px;font-weight:700}.footer{border-top:1px solid var(--line);margin-top:56px;padding:38px 0;color:var(--footer-text);background:var(--footer-bg);font-size:14px}.breadcrumbs{font-size:14px;color:var(--muted);margin:24px auto 0;max-width:var(--article);padding:0 var(--gutter)}.related{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.related a{display:block;padding:14px 16px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);font-weight:650}.byline{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:14px;margin:10px 0 20px}.sourcebox,.callout{margin-top:28px;padding:20px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel)}.faq details{border-top:1px solid var(--line);padding:15px 0}.faq summary{font-weight:700;cursor:pointer}
.btn-site{display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;border-radius:var(--r-button);background:var(--accent);color:var(--accent-text);font-weight:700;text-decoration:none;border:0}.btn-site:hover{text-decoration:none;filter:brightness(.96)}
.block-inner{max-width:var(--max);margin:auto;padding:0 var(--gutter)}.block-inner.narrow{max-width:var(--article)}.block-columns{display:grid;gap:24px}.block-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.block-gallery img{aspect-ratio:4/3}.block-quote{font-size:24px;line-height:1.45;border-left:4px solid var(--accent);padding-left:20px;color:var(--text)}.block-divider{border:0;border-top:1px solid var(--line)}.block-table{width:100%;border-collapse:collapse}.block-table th,.block-table td{border:1px solid var(--line);padding:10px;text-align:left}.block-video{position:relative;aspect-ratio:16/9}.block-video iframe,.block-video video{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:var(--r-image)}
 .article:not(.custom-layout) .builder-block{padding:0}.article:not(.custom-layout) .builder-block + .builder-block{margin-top:28px}
/* SEO Factory 0.4 freeform visual canvas. Geometry is stored as percentages so the
   published page follows the same composition as the editor. Each viewport can
   keep an independent X/Y/W/H/Z layout, like Comparison Video Studio. */
.visual-canvas{position:relative;width:100%;max-width:calc(var(--vcwd,1440)*1px);aspect-ratio:var(--vcwd,1440)/var(--vchd,1800);margin:0 auto;isolation:isolate;overflow:visible}
.visual-block{position:absolute;left:var(--dx,5%);top:var(--dy,5%);width:var(--dw,90%);height:var(--dh,10%);z-index:var(--dz,1);transform:rotate(var(--dr,0deg));opacity:var(--do,1);transform-origin:center center}
.visual-block>.builder-block{height:100%;padding:0;margin:0;background:transparent!important}
.visual-block>.builder-block>.block-inner{height:100%;max-width:none;padding:0;display:flex;flex-direction:column;justify-content:var(--dva,flex-start);overflow:var(--dov,visible)}
.visual-block .block-image,.visual-block .block-image img,.visual-block .block-video,.visual-block .block-video iframe,.visual-block .block-video video{width:100%;height:100%;margin:0}
.visual-block .block-image img{object-fit:var(--dfit,cover)}
.visual-block .block-gallery{height:100%}
.visual-block .card{height:100%}
@media(max-width:1024px){.visual-canvas{max-width:calc(var(--vcwt,834)*1px);aspect-ratio:var(--vcwt,834)/var(--vcht,1800)}.visual-block{left:var(--tx,var(--dx,5%));top:var(--ty,var(--dy,5%));width:var(--tw,var(--dw,90%));height:var(--th,var(--dh,10%));z-index:var(--tz,var(--dz,1));transform:rotate(var(--tr,var(--dr,0deg)));opacity:var(--to,var(--do,1))}}
@media(max-width:680px){.visual-canvas{max-width:calc(var(--vcwm,390)*1px);aspect-ratio:var(--vcwm,390)/var(--vchm,2400)}.visual-block{left:var(--mx,var(--tx,var(--dx,5%)));top:var(--my,var(--ty,var(--dy,5%)));width:var(--mw,var(--tw,var(--dw,90%)));height:var(--mh,var(--th,var(--dh,10%)));z-index:var(--mz,var(--tz,var(--dz,1)));transform:rotate(var(--mr,var(--tr,var(--dr,0deg))));opacity:var(--mo,var(--to,var(--do,1)))}}
@media(max-width:850px){.grid,.block-gallery{grid-template-columns:1fr}.related{grid-template-columns:1fr}.nav{display:none}.article:not(.custom-layout){border-radius:0;border-left:0;border-right:0;margin:0 auto}.block-columns{grid-template-columns:1fr!important}}
