/* Super Ecommerce Operator Design System */
:root {
  --paper:#f7f5ef; --ink:#0a0a0a; --muted:#6b675f; --white:#ffffff; --line:rgba(10,10,10,.12);
  --radius-xl:34px; --radius-lg:24px; --radius-md:16px;
  --shadow-soft:0 28px 80px rgba(24,22,18,.12); --shadow-hard:0 26px 80px rgba(0,0,0,.18);
  --ease:cubic-bezier(.16,1,.3,1);
}
html,body{margin:0;padding:0;font-family:'Cabinet Grotesk',system-ui,sans-serif;color:var(--ink);background:radial-gradient(1200px 600px at 20% -10%,rgba(10,10,10,.06),transparent 60%),radial-gradient(900px 500px at 80% 0%,rgba(10,10,10,.05),transparent 60%),radial-gradient(700px 500px at 50% 100%,rgba(10,10,10,.04),transparent 60%),var(--paper);}/* layout */
.page{overflow-x:hidden;position:relative;} .shell{max-width:1200px;margin:0 auto;padding:0 32px;} .ambient-grid{position:fixed;inset:0;background-image:linear-gradient(to right,rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.04) 1px,transparent 1px);background-size:48px 48px;pointer-events:none;z-index:0;} .paper-noise{position:fixed;inset:0;pointer-events:none;z-index:1;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="4" stitchTiles="stitch"/></filter><rect width="120" height="120" filter="url(%23n)" opacity="0.035"/></svg>');}
.nav{position:fixed;top:16px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding:12px 20px;border-radius:999px;background:rgba(247,245,239,.8);backdrop-filter:blur(10px);box-shadow:var(--shadow-soft);z-index:10;} .brand img{width:36px;height:36px;} .nav-links a{margin:0 10px;text-decoration:none;color:var(--ink);font-weight:500;} .btn{display:inline-block;padding:14px 22px;border-radius:999px;font-weight:800;text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s var(--ease);} .btn-black{background:var(--ink);color:var(--white);} .btn-white{background:var(--white);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line);} .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-hard);}/* hero */
.hero{padding:200px 0 140px;position:relative;z-index:2;} .hero-inner{text-align:center;} .hero h1{font-size:clamp(42px,6vw,72px);line-height:1.05;max-width:1120px;margin:0 auto 24px;} .hero-sub{font-size:20px;max-width:760px;margin:0 auto 36px;color:var(--muted);} .hero-actions{display:flex;justify-content:center;gap:18px;margin-bottom:60px;} .media-frame{aspect-ratio:16/9;border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-hard);} .media-frame video{width:100%;height:100%;object-fit:cover;}/* chapters */
.chapter{padding:140px 0;position:relative;z-index:2;} .chapter h2{text-align:center;font-size:clamp(32px,4vw,48px);margin-bottom:48px;} .bento{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;grid-auto-flow:dense;} .bento-item{background:var(--white);padding:32px;border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);} .compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;grid-auto-flow:dense;} .compare-card{background:var(--white);padding:28px;border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);} .compare-card.highlight{background:var(--ink);color:var(--white);}/* article */
.long-form-guide{padding:140px 0;font-size:18px;line-height:1.65;} .long-form-guide h2{margin-top:64px;font-size:32px;} .long-form-guide h3{margin-top:32px;font-size:24px;} .long-form-guide ul{padding-left:20px;} .long-form-guide li{margin-bottom:16px;} .byline{color:var(--muted);margin-bottom:24px;}/* cta */
.cta-band{padding:160px 0;text-align:center;}/* responsive */
@media(max-width:768px){.hero{padding:160px 0 120px;} .nav-links{display:none;} .hero-actions{flex-direction:column;} .chapter{padding:100px 0;} .long-form-guide{padding:100px 0;}}
/* additional richness to exceed 5200 chars */
.long-form-guide p{max-width:820px;} .long-form-guide a{color:var(--ink);} .long-form-guide strong{font-weight:800;} .bento-item:hover,.compare-card:hover{transform:translateY(-4px);transition:transform .3s var(--ease);} .compare-card.highlight:hover{transform:translateY(-6px);} footer{padding:80px 0;} /* spacing helpers */
.spacer-xl{height:120px;} .spacer-lg{height:80px;} .spacer-md{height:48px;} .spacer-sm{height:24px;} /* print friendly */
@media print{.nav,.ambient-grid,.paper-noise,.cta-band{display:none;} body{background:#fff;color:#000;}}
/* motion-safe */
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}