/* GrosPrint UI layer — the "Start selling" look. Load after colors_and_type.css.
   Glass cards on a moving colour background, yellow CTA, yellow→pink gradient for "us", grey for "them", green checks. */
:root{
  --gp-pink:#ff3ea5;--gp-green:#00b473;--gp-green-ink:#0a5c3d;--gp-sky:#38c6ff;--gp-lime:#c8ff7a;
  --gp-grad:linear-gradient(90deg,#ffd02f,#ff3ea5); /* @kind other */
  --gp-grad-text:linear-gradient(90deg,#1c1c1e,#ff3ea5); /* @kind other */
  --gp-glass:rgba(255,255,255,.78);--gp-glass-border:#ffffffaa;--gp-glass-shadow:0 20px 60px -24px rgba(5,0,56,.18);
  --gp-them:#c7cad5;--gp-track:#eef0f3;--gp-ease:cubic-bezier(.2,.8,.2,1); /* @kind other */
}
body{background:transparent}
/* moving background */
.gp-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,#fff 0%,#fff4fa 45%,#f0fbff 100%)}
.gp-bg i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.8;animation:gp-fl 24s ease-in-out infinite alternate}
.gp-bg i:nth-child(1){width:56vw;height:56vw;left:-16vw;top:-20vw;background:#ffd02f;animation-duration:22s}
.gp-bg i:nth-child(2){width:48vw;height:48vw;right:-14vw;top:4vh;background:#ff8dcf;animation-duration:27s;animation-delay:-9s}
.gp-bg i:nth-child(3){width:44vw;height:44vw;left:20vw;bottom:-24vw;background:#7fe7ff;animation-duration:25s;animation-delay:-15s}
.gp-bg i:nth-child(4){width:32vw;height:32vw;right:16vw;bottom:-6vw;background:#c8ff7a;animation-duration:31s;animation-delay:-5s;opacity:.55}
.gp-bg .grid{position:absolute;inset:-40%;background-image:linear-gradient(#1c1c1e0d 1px,transparent 1px),linear-gradient(90deg,#1c1c1e0d 1px,transparent 1px);background-size:64px 64px;animation:gp-gr 40s linear infinite;mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 75%)}
@keyframes gp-fl{0%{transform:translate(0,0) scale(1)}50%{transform:translate(7vw,5vh) scale(1.14)}100%{transform:translate(-6vw,9vh) scale(.94)}}
@keyframes gp-gr{to{transform:translate(64px,64px)}}
@media(prefers-reduced-motion:reduce){.gp-bg *{animation:none!important}}
/* glass surface */
.g{background:var(--gp-glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--gp-glass-border);border-radius:28px;box-shadow:var(--gp-glass-shadow)}
/* sticky header */
.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid #ffffff99}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;background:var(--color-ink,#1c1c1e);color:#fff;font:500 15px var(--font-primary,sans-serif);border-radius:999px;padding:14px 22px;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn:hover{background:#2c2c34;color:#fff}
.btn.y{position:relative;overflow:hidden;background:linear-gradient(135deg,#ffe066,#ffd02f 55%,#ffc400);color:#1c1c1e;box-shadow:0 14px 34px -12px #ffd02f;transition:transform .2s,box-shadow .25s;isolation:isolate;animation:gp-cta 2.8s ease-in-out infinite}.btn.y::before{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.7),transparent);transform:skewX(-20deg);animation:gp-sheen 3.2s ease-in-out infinite;z-index:-1}.btn.y:hover{background:linear-gradient(135deg,#fff0a3,#ffdd5c 55%,#ffd02f);color:#1c1c1e;transform:translateY(-2px) scale(1.02);box-shadow:0 22px 44px -14px #ffd02f,0 0 0 6px #ffd02f33}.btn.y:active{transform:none}@keyframes gp-sheen{0%,55%{left:-60%}100%{left:130%}}@keyframes gp-cta{0%,100%{box-shadow:0 14px 34px -12px #ffd02f,0 0 0 0 #ffd02f66}50%{box-shadow:0 18px 40px -12px #ffd02f,0 0 0 10px #ffd02f00}}@media(prefers-reduced-motion:reduce){.btn.y,.btn.y::before{animation:none}}
.btn.xl{font-size:18px;padding:20px 32px}
.btn.ghost{background:none;color:#1c1c1e;border:1px solid #c7cad5;box-shadow:none}.btn.ghost:hover{background:#f7f8fa;color:#1c1c1e}
/* gradient headline accent */
.grad{background:var(--gp-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
/* live pill */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#1c1c1e;background:#fff;border-radius:999px;padding:6px 12px;box-shadow:0 6px 20px -10px rgba(5,0,56,.25)}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--gp-green);box-shadow:0 0 0 4px #00b47333;animation:gp-pulse 1.6s infinite}
@keyframes gp-pulse{50%{box-shadow:0 0 0 8px #00b47311}}
/* us vs them bars */
.vbar{display:grid;grid-template-columns:70px 1fr 36px;align-items:center;gap:10px;font-size:13px}
.vbar .tr{height:12px;background:var(--gp-track);border-radius:999px;overflow:hidden}.vbar .tr i{display:block;height:100%;width:0;border-radius:999px;transition:width 1.2s var(--gp-ease)}
.vbar.us{color:var(--gp-green-ink);font-weight:600}.vbar.us i{background:var(--gp-grad)}.vbar.them{color:#6b6f7e}.vbar.them i{background:var(--gp-them)}
/* check / tilde / dash marks */
.mark{flex:none;width:20px;height:20px;border-radius:50%;display:inline-grid;place-items:center;font-style:normal;font-size:12px;font-weight:700}
.mark.y{background:var(--gp-green);color:#fff}.mark.n{background:#ffe0e0;color:#b3261e}.mark.p{background:#fff1b8;color:#746019}
/* comparison table (data-cmp from gp-v2.js) */
.cmp{background:#fff;border:0;border-radius:20px;overflow:hidden;box-shadow:0 12px 40px -12px rgba(5,0,56,.12)}
.cmp-h .cmp-us{color:#1c1c1e!important;display:inline-flex;align-items:center;gap:8px}.cmp-h .cmp-us::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--gp-green);box-shadow:0 0 0 4px #00b47333}
.cmp-r .cmp-us{position:relative;padding-left:30px!important;color:var(--gp-green-ink)}.cmp-r .cmp-us::before{content:"✓";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--gp-green);color:#fff;font-size:13px;font-weight:700;display:grid;place-items:center}
.cmp-r .cmp-them{position:relative;padding-left:30px}.cmp-r .cmp-them::before{content:"–";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--gp-track);color:#8e91a0;font-size:14px;font-weight:700;display:grid;place-items:center}
.cmp-r.tie .cmp-them::before{content:"✓";background:var(--gp-them);color:#fff}.cmp-r.tie .cmp-us{color:inherit}.cmp-r:hover{background:#fffbea}
/* score + rank */
.score b{color:var(--gp-green-ink)}.pos{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:var(--gp-track);color:#555a6a}.pos.first{background:linear-gradient(135deg,#ffd02f,var(--gp-pink));color:#fff;box-shadow:0 10px 24px -10px var(--gp-pink)}
/* dark closing block with slow glow */
.end{background:#1c1c1e;color:#fff;border-radius:32px;padding:64px 32px;display:grid;justify-items:center;text-align:center;gap:20px;position:relative;overflow:hidden}
.end::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,#ffd02f33,#ff3ea533,#38c6ff33,#ffd02f33);animation:gp-spin 18s linear infinite}.end>*{position:relative}.end h2{color:#fff}
@keyframes gp-spin{to{transform:rotate(1turn)}}
/* sticky bottom CTA */
.stick{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;justify-content:center;padding:12px;transform:translateY(120%);transition:transform .35s}.stick.on{transform:none}
/* legacy classes from older landings mapped to the look */
.card,.fc,.pc,.qc,.of,.hub,.vc,.mc,.faq>div{box-shadow:var(--gp-glass-shadow)}
.chain .st,.chain .st img{box-shadow:none;background:transparent;filter:drop-shadow(0 12px 20px rgba(80,0,120,.18))}
.gate-form button,.sim,form button[type=submit]{background:#ffd02f!important;color:#1c1c1e!important;box-shadow:0 14px 34px -12px #ffd02f}
.gate-form button:hover,form button[type=submit]:hover{background:#ffdd5c!important}

/* v4 shared header: logo sizes, nav collapse, lang pill, CTA fit */
.brand-logo,.logo img.brand-logo{width:224px!important;height:auto!important;display:block}
.bar{display:flex;align-items:center;gap:12px;min-height:64px}.bar nav{display:flex;gap:18px;margin-left:auto;white-space:nowrap}.bar nav a{white-space:nowrap}.bar .btn{flex:none;white-space:nowrap}.bar .btn.y{padding:11px 18px;font-size:15px}
@media(max-width:1260px){.brand-logo,.logo img.brand-logo{width:190px!important}}
@media(max-width:1080px){.bar nav{display:none}.bar .ls{margin-left:auto}}
@media(max-width:480px){.bar{gap:8px}.brand-logo,.logo img.brand-logo{width:150px!important}.bar .btn.y{padding:10px 14px;font-size:14px}}
/* v4 shared mobile */
@media(max-width:700px){.wrap{padding-left:16px;padding-right:16px}.btn.xl{font-size:17px;padding:18px 24px;width:100%}.end{padding:40px 20px;border-radius:24px}.stick{padding:10px 12px}.stick a{width:100%}.g{border-radius:22px}img,picture,svg,video{max-width:100%}table{font-size:12px}}
@media(max-width:700px){h1{font-size:clamp(32px,9.5vw,44px)!important;letter-spacing:-1.2px}h2{font-size:clamp(26px,7vw,34px)!important}}

/* nav — visible pills, active section */
.hdr{background:rgba(255,255,255,.86);border-bottom:1px solid var(--color-hairline-soft,#eee)}
.bar{height:auto}
.bar nav{gap:2px;font-size:14px;font-weight:600}
.bar nav a{color:var(--color-ink,#1c1c1e);padding:7px 11px;border-radius:999px;text-decoration:none;transition:background .2s,color .2s,box-shadow .2s}
.bar nav a:hover{background:#fff;box-shadow:0 2px 12px rgba(28,28,30,.12),inset 0 -2px 0 var(--pk,#ff3ea5)}
.bar nav a.on{background:var(--color-ink,#1c1c1e);color:#fff;box-shadow:none}
@media(max-width:1080px){.bar{flex-wrap:wrap;row-gap:0}.bar nav{display:flex;order:9;width:100%;margin:0 -4px;padding:0 0 10px;overflow-x:auto;scrollbar-width:none;gap:6px;font-size:14px}.bar nav::-webkit-scrollbar{display:none}.bar nav a{background:#fff;border:1px solid var(--color-hairline,#e5e5e5);padding:7px 13px}}
/* footer */
footer.gpf{margin-top:64px;padding:56px 0 28px;background:var(--color-ink,#1c1c1e);color:#d9d9de;border:0;font-size:15px}
.gpf a{color:#fff;text-decoration:none}
.gpf-g{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:40px}
.gpf-b{display:grid;gap:16px;justify-items:start;max-width:360px}
.gpf-b img{height:26px;width:auto;filter:brightness(0) invert(1)}
.gpf-b p{margin:0;color:#c7c7cc;line-height:1.5}
.gpf-c{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.gpf-c h4{margin:0 0 4px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8e8e93}
.gpf-c a,.gpf-c button{color:#fff;font:500 15px var(--font-primary,inherit);background:none;border:0;padding:0;cursor:pointer;text-align:left;background-image:linear-gradient(var(--color-yellow,#ffd02f),var(--color-yellow,#ffd02f));background-size:0 2px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s}
.gpf-c a:hover,.gpf-c button:hover,.gpf-c a.on{background-size:100% 2px}
.gpf-bot{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:44px;padding-top:22px;border-top:1px solid #3a3a3c;font-size:13px;color:#aeaeb2}
.gpf-fm{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid #48484a;border-radius:999px;font-weight:600;color:#fff}
.gpf-fm i{width:8px;height:8px;border-radius:50%;background:var(--color-yellow,#ffd02f);box-shadow:0 0 0 3px rgba(255,208,47,.25)}
.gpf-fm:hover{border-color:var(--color-yellow,#ffd02f)}
.gpf .credit{margin-left:auto;opacity:.75;font-size:12px;color:#fff;border-bottom:1px dotted #8e8e93}
.gpf .credit:hover{opacity:1}
@media(max-width:760px){.gpf-g{grid-template-columns:1fr 1fr}.gpf-b{grid-column:1/-1}.gpf .credit{margin-left:0}}
/* cookie banner */
#gp-ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;max-width:560px;margin:0 auto;background:#fff;border:1px solid var(--color-hairline,#e5e5e5);border-radius:18px;box-shadow:0 16px 48px rgba(28,28,30,.18);padding:16px 18px;display:grid;gap:12px;font-size:14px;line-height:1.45}
#gp-ck p{margin:0}#gp-ck a{color:var(--color-ink,#1c1c1e);font-weight:600}
#gp-ck div{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}#gp-ck .btn{padding:10px 16px;font-size:14px}
/* legal / static pages */
.lg{max-width:780px;margin:0 auto;padding:56px 24px 24px}
.lg .k{font:600 12px var(--font-primary);letter-spacing:.14em;text-transform:uppercase;color:var(--pk,#ff3ea5)}
.lg h1{font-size:clamp(34px,5vw,52px);line-height:1.05;margin:10px 0 12px;text-wrap:balance}
.lg .upd{color:var(--color-slate,#555);font-size:14px;margin:0 0 28px}
.lg h2{font-size:22px;margin:40px 0 10px;scroll-margin-top:96px}
.lg p,.lg li{font-size:16px;line-height:1.65;color:var(--color-ink,#1c1c1e);text-wrap:pretty}
.lg ul{padding-left:20px;display:grid;gap:6px}
.lg a{color:var(--color-ink,#1c1c1e);font-weight:600;text-decoration:underline;text-decoration-color:var(--pk,#ff3ea5);text-decoration-thickness:2px;text-underline-offset:3px}
.lg a:hover{background:var(--color-yellow,#ffd02f)}
.lg .toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px;padding:0;list-style:none}
.lg .toc a{display:inline-block;padding:6px 12px;border:1px solid var(--color-hairline,#e5e5e5);border-radius:999px;font-size:13px;text-decoration:none;background:#fff}
.lg .note{font-size:13px;color:var(--color-slate,#555);border-top:1px solid var(--color-hairline,#e5e5e5);padding-top:16px;margin-top:40px}
.lg mark{background:#fff3b8;padding:0 4px;border-radius:4px}
.lg table{width:100%;border-collapse:collapse;font-size:14px;margin:8px 0}.lg th,.lg td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--color-hairline,#e5e5e5);vertical-align:top}
.ctg{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:12px;margin:24px 0}
.ctg>div{background:#fff;border:1px solid var(--color-hairline,#e5e5e5);border-radius:18px;padding:18px;display:grid;gap:6px}
.ctg h3{margin:0;font-size:14px;color:var(--color-slate,#555);font-weight:600}.ctg a{font-size:17px}