/* Two-offer positioning (1 Oct 2026): hero routes, the illustrative content week,
   offer layouts and the websites side offer. Uses the site's existing tokens. */

/* Hero: two route cards and a websites link underneath. */
.hero-routes { display:grid;gap:14px;min-width:0;align-self:center; }
.route { position:relative;display:grid;gap:12px;padding:26px 28px 24px;border:1px solid var(--border-strong);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-solid) 94%,var(--brand)),var(--surface-solid));box-shadow:0 30px 80px #0003;color:var(--text);text-decoration:none;transition:transform .35s ease,border-color .35s ease; }
.route:hover { transform:translateY(-4px);border-color:var(--border-brand); }
.route__k { font:600 .62rem/1.2 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-pale); }
.route__h { font:600 clamp(1.25rem,1rem + .8vw,1.6rem)/1.2 var(--font-display);letter-spacing:-.02em; }
.route ul { list-style:none;margin:2px 0 4px;padding:0;display:grid;gap:7px; }
.route li { position:relative;padding-left:20px;font-size:.92rem;line-height:1.45;color:var(--text-2); }
.route li::before { content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--brand) 55%,transparent); }
.route__price { display:flex;justify-content:space-between;align-items:center;padding-top:14px;border-top:1px solid var(--border);font:600 1rem/1.2 var(--font-display); }
.route__price i { font-style:normal;color:var(--brand-lift);transition:transform .25s ease; }
.route:hover .route__price i { transform:translate(2px,-2px); }
.hero-routes__foot { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;border:1px dashed var(--border-strong);border-radius:14px;color:var(--text-2);text-decoration:none;font-size:.88rem;transition:border-color .25s ease,color .25s ease; }
.hero-routes__foot b { color:var(--text);font-weight:600; }
.hero-routes__foot:hover { border-color:var(--border-brand);color:var(--text); }

/* Offer layouts. */
.offer-split { display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,64px);align-items:center;margin-bottom:clamp(36px,5vw,56px); }
.offer-split .section-heading { margin-bottom:0; }
.offer-split .btn { margin-top:22px; }
.wx-packages--2 { grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px; }
.wx-pack__price small:last-child { margin-left:2px; }

/* The illustrative content week. */
.week-board { min-width:0;border:1px solid var(--border-brand);border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-solid) 96%,var(--brand)),var(--surface-solid));box-shadow:0 35px 90px #0003;overflow:hidden; }
.week-board__bar,.week-board__foot { display:flex;justify-content:space-between;gap:12px;padding:16px 20px;font-size:.74rem;color:var(--text-2); }
.week-board__bar { border-bottom:1px solid var(--border);font-weight:600;color:var(--text); }
.week-board__bar small { font:500 .56rem/1.6 var(--font-mono);letter-spacing:.12em;color:var(--text-3); }
.week-board__foot { border-top:1px solid var(--border);font-size:.68rem; }
.week-board__posts { list-style:none;margin:0;padding:18px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px; }
.post { display:flex;flex-direction:column;gap:8px;min-width:0; }
.post__day { font:600 .58rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3); }
.post__art { position:relative;aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;padding:10px;border-radius:10px;background:linear-gradient(160deg,color-mix(in srgb,var(--brand) 70%,#0b0d18),#0b0d18);color:#fff;overflow:hidden; }
.post:nth-child(2) .post__art { background:linear-gradient(160deg,#1e3932,#0b0d18); }
.post:nth-child(3) .post__art { background:linear-gradient(160deg,#f4f1ea,#d9d3c7);color:#111; }
.post:nth-child(4) .post__art { background:linear-gradient(160deg,#2f9e7a,#0d3a2d); }
.post:nth-child(5) .post__art { background:linear-gradient(160deg,#c2410c,#3b1206); }
.post__art b { font:600 .7rem/1.2 var(--font-display);letter-spacing:-.01em; }
.post__art i { display:block;height:4px;border-radius:2px;background:currentColor;opacity:.35; }
.post__art i:last-child { width:60%; }
.post p { font-size:.68rem;line-height:1.4;color:var(--text-2); }
.post__status { align-self:flex-start;padding:3px 7px;border-radius:99px;font:600 .52rem/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase; }
.post--approved .post__status { background:color-mix(in srgb,#2f9e7a 18%,transparent);color:#2f9e7a; }
.post--scheduled .post__status { background:color-mix(in srgb,var(--brand) 18%,transparent);color:var(--brand-pale); }
.post--waiting .post__status { background:color-mix(in srgb,#d97706 20%,transparent);color:#d97706; }

/* Model-choice strip: grouped logos. */
.tool-strip__group { margin:30px 0 0;font:600 .6rem/1.2 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3); }
.tool-strip__group + .tool-strip__logos { margin-top:16px; }

/* Websites as the side offer. */
.side-offer { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px 40px;align-items:center;padding:clamp(26px,4vw,40px);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface); }
.side-offer h2 { margin:10px 0 8px;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem); }
.side-offer p { color:var(--text-2);max-width:520px; }
.side-offer ul { list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px; }
.side-offer li a { display:grid;gap:4px;min-width:150px;padding:14px 16px;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-solid);color:var(--text);text-decoration:none;transition:border-color .25s ease,transform .25s ease; }
.side-offer li a:hover { border-color:var(--border-brand);transform:translateY(-2px); }
.side-offer li small { font-size:.74rem;color:var(--text-2); }
.side-offer li b { font:600 1.1rem/1.2 var(--font-display); }
.side-offer > .text-link { grid-column:1/-1; }

@media(max-width:1100px){ .week-board__posts { grid-template-columns:repeat(3,minmax(0,1fr)); } .post:nth-child(n+4) { display:none; } }
@media(max-width:900px){ .offer-split { grid-template-columns:1fr; } .side-offer { grid-template-columns:1fr; } .wx-packages--2 { max-width:none; } }
@media(max-width:800px){ .hero-routes { margin-top:6px; } }
@media(max-width:650px){ .route { padding:22px 20px 20px; } .wx-packages--2 { grid-template-columns:1fr; } .week-board__posts { grid-template-columns:repeat(2,minmax(0,1fr));padding:14px; } .post:nth-child(n+3) { display:none; } .week-board__foot span:last-child { display:none; } }
@media(prefers-reduced-motion:reduce){ .route,.route__price i,.side-offer li a,.hero-routes__foot { transition:none; } .route:hover,.side-offer li a:hover { transform:none; } }
.tool-strip__group { margin-inline:auto;max-width:none;text-align:center; }

/* A single package (content automation on /automation). */
.wx-packages--1 { grid-template-columns:minmax(0,1fr);max-width:440px; }

/* Free automation check (6 Oct 2026). */
.check-card { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);padding:clamp(26px,4vw,48px);border:1px solid var(--border-brand);border-radius:var(--r-lg);background:linear-gradient(145deg,color-mix(in srgb,var(--surface-solid) 92%,var(--brand)),var(--surface-solid));box-shadow:var(--shadow-card); }
.check-card h2 { margin:12px 0 14px; }
.check-card .btn { margin-top:22px; }
.check-note { margin-top:12px;font-size:.86rem;color:var(--text-2); }
.check-h { font:600 .72rem/1.3 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-pale);margin-bottom:12px; }
.check-list { list-style:none;margin:0 0 24px;padding:0;display:grid;gap:10px; }
.check-list li { position:relative;padding-left:28px;line-height:1.5; }
.check-list li::before { content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:color-mix(in srgb,var(--brand) 18%,transparent); }
.check-list li::after { content:"";position:absolute;left:6px;top:7px;width:6px;height:9px;border:solid var(--brand-lift);border-width:0 2px 2px 0;transform:rotate(45deg); }
.check-steps { list-style:none;margin:0;padding:18px 0 0;border-top:1px solid var(--border);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:cs; }
.check-steps li { display:grid;gap:4px;counter-increment:cs; }
.check-steps b { font:600 .95rem/1.3 var(--font-display); }
.check-steps b::before { content:counter(cs,decimal-leading-zero) " ";font:600 .7rem/1 var(--font-mono);color:var(--brand-pale); }
.check-steps span { font-size:.84rem;color:var(--text-2);line-height:1.45; }

/* One task handled by an agent. */
.chain { list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;counter-reset:ch; }
.chain__step { position:relative;display:grid;align-content:start;gap:8px;padding:16px 14px;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-solid);counter-increment:ch; }
.chain__step small { font:600 .62rem/1.2 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2); }
.chain__step small::before { content:counter(ch) " · "; }
.chain__step span { font-size:.9rem;line-height:1.45; }
.chain__step--agent small { color:var(--brand-pale); }
.chain__step--you { border-color:color-mix(in srgb,var(--signal) 60%,var(--border-strong)); }
.chain__step--you small { color:var(--signal); }
.chain__step:not(:last-child)::after { content:"→";position:absolute;right:-9px;top:50%;transform:translateY(-50%);font-size:.8rem;color:var(--text-3); }

@media(max-width:1100px){ .chain { grid-template-columns:repeat(3,minmax(0,1fr)); } .chain__step:nth-child(3)::after { display:none; } }
@media(max-width:900px){ .check-card { grid-template-columns:1fr; } }
@media(max-width:560px){ .chain { grid-template-columns:1fr; } .chain__step::after { display:none; } .check-steps { grid-template-columns:1fr; } }