/* ShopifyKnow decision-and-action homepage */
.kb-hero { position:relative;overflow:hidden;padding:96px 0 88px;background:linear-gradient(135deg,var(--sk-surface) 0%,#fff 62%,var(--sk-blue-soft) 100%);border-bottom:1px solid var(--sk-line); }
.kb-hero::before { content:"";position:absolute;right:-160px;top:-230px;width:560px;height:560px;border:1px solid rgba(18,53,91,.11);border-radius:50%;box-shadow:0 0 0 80px rgba(18,53,91,.024),0 0 0 160px rgba(18,53,91,.014);pointer-events:none; }
.kb-hero-grid { position:relative;display:grid;grid-template-columns:minmax(0,1040px);justify-content:center;text-align:center; }
.kb-hero-copy { display:flex;flex-direction:column;align-items:center; }
.kb-kicker,.kb-section-title span,.kb-about>div>div>span { display:block;margin-bottom:14px;color:var(--sk-blue);font-size:12px;font-weight:850;line-height:1.6;letter-spacing:.14em;text-transform:uppercase; }
.kb-hero h1 { max-width:1040px;margin:0;color:var(--sk-ink);font-size:clamp(46px,5.8vw,72px);line-height:1.08;letter-spacing:-.055em;text-wrap:balance; }
.kb-hero h1 span { display:block;color:var(--sk-blue); }
.kb-hero-copy>p { max-width:960px;margin:25px 0 0;color:var(--sk-muted);font-size:18px;line-height:1.8;text-wrap:balance; }
.kb-actions { display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px; }
.kb-button { display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:11px 21px;border:1px solid var(--sk-line);border-radius:12px;font-weight:750;transition:.2s ease; }
.kb-button:hover { transform:translateY(-2px); }
.kb-button-primary { border-color:var(--sk-blue);color:#fff;background:var(--sk-blue);box-shadow:0 10px 24px rgba(18,53,91,.18); }
.kb-button-primary:hover { color:#fff;background:var(--sk-blue-dark); }
.kb-button-light { color:var(--sk-ink);background:#fff; }
.kb-button-light:hover { color:var(--sk-blue);border-color:#aebdca;background:var(--sk-blue-soft); }
.kb-hero-points { display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;margin:25px 0 0;padding:0;list-style:none;color:var(--sk-muted);font-size:13px; }
.kb-hero-points li::before { content:"✓";margin-right:7px;color:var(--sk-blue);font-weight:900; }
.kb-section { padding:88px 0; }
.kb-section-title h2,.kb-about h2 { margin:0;color:var(--sk-ink);font-size:clamp(30px,4vw,44px);line-height:1.2;letter-spacing:-.035em;text-wrap:balance; }
.kb-section-title { display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:36px; }
.kb-section-title span { margin-bottom:7px; }
.kb-section-title p { max-width:730px;margin:12px 0 0;color:var(--sk-muted);line-height:1.8;text-wrap:pretty; }
.kb-section-title>a { color:var(--sk-blue);font-weight:750;white-space:nowrap; }

/* Learning route */
.kb-route-section { position:relative;border-bottom:1px solid var(--sk-line);background:var(--sk-surface); }
.kb-route-shell { position:relative;overflow:hidden;padding:28px;border:1px solid var(--sk-line);border-radius:28px;background-color:#f2f3f4;background-image:radial-gradient(rgba(18,53,91,.09) .8px,transparent .8px);background-size:18px 18px;box-shadow:0 22px 54px rgba(17,19,24,.07); }
.kb-route-shell::before { content:"";position:absolute;right:-110px;bottom:-180px;width:360px;height:360px;border:1px solid rgba(18,53,91,.1);border-radius:50%;box-shadow:0 0 0 55px rgba(18,53,91,.02),0 0 0 110px rgba(18,53,91,.012);pointer-events:none; }
.kb-route-meta { position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px;padding:0 3px;color:var(--sk-muted);font-size:12px;font-weight:750;letter-spacing:.04em; }
.kb-route-meta span { display:flex;align-items:center;gap:8px; }
.kb-route-meta i { width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:var(--sk-blue);box-shadow:0 0 0 3px rgba(18,53,91,.12); }
.kb-route-meta b { padding:6px 11px;border:1px solid #cbd5df;border-radius:999px;color:var(--sk-blue);background:rgba(255,255,255,.82);font-size:12px; }
.kb-route-grid { position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:38px 28px;margin:0;padding:0;list-style:none; }
.kb-route-step { position:relative;min-width:0; }
.kb-route-step:nth-child(1) { grid-area:1/1; }
.kb-route-step:nth-child(2) { grid-area:1/2; }
.kb-route-step:nth-child(3) { grid-area:1/3; }
.kb-route-step:nth-child(4) { grid-area:1/4; }
.kb-route-step:nth-child(5) { grid-area:2/4; }
.kb-route-step:nth-child(6) { grid-area:2/3; }
.kb-route-step:nth-child(7) { grid-area:2/2; }
.kb-route-step:nth-child(8) { grid-area:2/1; }
.kb-route-step::after { z-index:2;position:absolute;color:#9aa6b2;font-size:24px;font-weight:400;line-height:1;pointer-events:none; }
.kb-route-step:nth-child(-n+3)::after { content:"→";top:calc(50% - 12px);right:-26px; }
.kb-route-step:nth-child(4)::after { content:"↓";right:calc(50% - 7px);bottom:-31px; }
.kb-route-step:nth-child(5)::after,.kb-route-step:nth-child(6)::after,.kb-route-step:nth-child(7)::after { content:"←";top:calc(50% - 12px);left:-26px; }
.kb-route-step>a { position:relative;z-index:1;min-height:238px;display:flex;flex-direction:column;padding:22px;overflow:hidden;border:1px solid var(--sk-line);border-radius:19px;color:var(--sk-text);background:rgba(255,255,255,.97);box-shadow:0 10px 28px rgba(15,23,42,.06);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.kb-route-step>a::before { content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:var(--sk-blue);transform:scaleX(.34);transform-origin:left;transition:transform .25s ease; }
.kb-route-step>a:hover { color:var(--sk-text);border-color:#aebdca;box-shadow:0 18px 38px rgba(18,53,91,.1);transform:translateY(-4px); }
.kb-route-step>a:hover::before { transform:scaleX(1); }
.kb-route-card-top { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.kb-route-index { width:44px;height:44px;display:grid;place-items:center;border:3px solid #fff;border-radius:50%;color:#fff;background:var(--sk-blue);box-shadow:0 0 0 1px #aebdca,0 8px 18px rgba(18,53,91,.16);font-size:13px;font-weight:900; }
.kb-route-card-top small { color:var(--sk-muted);font-size:11px;font-weight:800;letter-spacing:.1em; }
.kb-route-step h3 { margin:20px 0 9px;color:var(--sk-ink);font-size:20px;line-height:1.4;letter-spacing:-.02em;text-wrap:balance; }
.kb-route-step p { margin:0;color:var(--sk-muted);font-size:14px;line-height:1.75;text-wrap:pretty; }
.kb-route-step strong { display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:17px;color:var(--sk-blue);font-size:13px; }
.kb-route-step strong span { transition:transform .2s ease; }
.kb-route-step>a:hover strong span { transform:translateX(4px); }
.kb-route-step:not(:last-child):nth-child(3n+2)>a::before { background:var(--sk-blue); }
.kb-route-step:not(:last-child):nth-child(3n+2) .kb-route-index { background:var(--sk-blue);box-shadow:0 0 0 1px #aebdca,0 8px 18px rgba(18,53,91,.16); }
.kb-route-step:not(:last-child):nth-child(3n+2) strong { color:var(--sk-blue); }
.kb-route-step:last-child>a { border-color:var(--sk-blue);background:linear-gradient(145deg,var(--sk-ink),var(--sk-blue-dark));box-shadow:0 15px 32px rgba(17,19,24,.18); }
.kb-route-step:last-child>a::before { background:#fff;transform:scaleX(1); }
.kb-route-step:last-child .kb-route-index { color:var(--sk-blue);background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.24),0 8px 18px rgba(0,0,0,.15); }
.kb-route-step:last-child .kb-route-card-top small { color:#cbd2da; }
.kb-route-step:last-child h3 { color:#fff; }
.kb-route-step:last-child p { color:#d6dbe1; }
.kb-route-step:last-child strong { color:#fff; }
.kb-route-step:last-child>a:hover { border-color:#6f8295;box-shadow:0 20px 42px rgba(17,19,24,.24); }

.kb-latest { background:#fff; }
.kb-latest-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px; }
.kb-learning-card { min-width:0;min-height:260px;display:flex;overflow:hidden;border:1px solid var(--sk-line);border-top:3px solid var(--sk-blue);border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.kb-learning-card:nth-child(3n+2) { border-top-color:var(--sk-blue); }
.kb-learning-card:hover { border-color:#aebdca;box-shadow:0 16px 34px rgba(18,53,91,.08);transform:translateY(-3px); }
.kb-learning-card-link { width:100%;display:flex;flex:1;flex-direction:column;padding:26px;color:var(--sk-text); }
.kb-learning-card-link:hover { color:var(--sk-text); }
.kb-learning-card h3 { margin:0;color:var(--sk-ink);font-size:21px;line-height:1.48;letter-spacing:-.015em;text-wrap:balance; }
.kb-learning-card p { margin:14px 0 24px;color:var(--sk-muted);font-size:15px;line-height:1.8;text-wrap:pretty; }
.kb-learning-action { min-height:42px;display:flex;align-items:center;justify-content:center;margin-top:auto;padding:8px 16px;border:1px solid #cbd5df;border-radius:9px;color:var(--sk-blue);background:#fff;font-size:15px;font-weight:800;transition:background-color .2s ease,border-color .2s ease; }
.kb-learning-card:nth-child(3n+2) .kb-learning-action { color:var(--sk-blue);border-color:#cbd5df; }
.kb-learning-card:hover .kb-learning-action { border-color:#aebdca;background:var(--sk-blue-soft); }
.kb-learning-card:nth-child(3n+2):hover .kb-learning-action { border-color:#aebdca;background:var(--sk-blue-soft); }

.kb-about { padding:80px 0;background:linear-gradient(135deg,var(--sk-ink),var(--sk-blue-dark)); }
.kb-about-grid { display:grid;grid-template-columns:1.28fr .72fr;align-items:center;gap:70px; }
.kb-about>div>div>span { color:#cbd2da; }
.kb-about h2 { color:#fff; }
.kb-about p { max-width:750px;margin:18px 0 28px;color:#d6dbe1;font-size:16px;line-height:1.85;text-wrap:pretty; }
.kb-about ul { display:grid;gap:12px;margin:0;padding:0;list-style:none; }
.kb-about li { display:grid;grid-template-columns:55px 1fr;gap:14px;align-items:center;padding:16px;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:rgba(255,255,255,.06); }
.kb-about li b { color:#fff; }
.kb-about li span { margin:0;color:#d6dbe1;font-size:14px;line-height:1.65;letter-spacing:0;text-transform:none;text-wrap:pretty; }

@media(max-width:980px){
  .kb-hero-grid,.kb-about-grid{grid-template-columns:1fr}.kb-latest-grid{grid-template-columns:repeat(2,1fr)}
  .kb-route-grid{display:grid;grid-template-columns:1fr;gap:20px}.kb-route-step:nth-child(n){grid-area:auto}.kb-route-step:nth-child(n)::after{content:"↓";top:auto;right:auto;bottom:-21px;left:25px;font-size:20px}.kb-route-step:last-child::after{content:none}.kb-route-step>a{min-height:0}.kb-route-meta span:last-child{display:none}
}
@media(max-width:700px){
  .kb-hero{padding:62px 0 54px}.kb-hero::before{display:none}.kb-hero h1{font-size:clamp(36px,9.75vw,40px)}.kb-hero-copy>p{font-size:16px;line-height:1.85}.kb-actions{display:grid;width:100%}.kb-button{width:100%}.kb-hero-points{display:grid;grid-template-columns:repeat(3,auto);gap:6px;font-size:12px}.kb-section{padding:66px 0}.kb-latest-grid{grid-template-columns:1fr}.kb-section-title{display:block}.kb-section-title>a{display:inline-block;margin-top:15px}.kb-route-shell{padding:18px;border-radius:21px}.kb-route-meta{margin-bottom:17px}.kb-route-step>a{padding:20px}.kb-route-step h3{margin-top:17px}.kb-learning-card{min-height:230px}.kb-learning-card-link{padding:22px}.kb-about{padding:66px 0}.kb-about-grid{gap:36px}
}

/* 3.1 editorial homepage rhythm */
.kb-hero { padding: 112px 0 102px; border-bottom: 0; }
.kb-hero-grid { grid-template-columns: minmax(0, 960px); justify-content: start; text-align: left; }
.kb-hero-copy { align-items: flex-start; }
.kb-hero h1 { max-width: 960px; font-size: clamp(52px, 5.7vw, 68px); line-height: 1.05; letter-spacing: -.06em; }
.kb-hero-copy > p { max-width: 860px; margin-top: 28px; text-wrap: pretty; }
.kb-actions, .kb-hero-points { justify-content: flex-start; }
.kb-actions { margin-top: 36px; }
.kb-hero-points { margin-top: 28px; }
.kb-section { padding: 104px 0; }
.kb-section-title { align-items: flex-end; margin-bottom: 48px; }
.kb-section-title h2, .kb-about h2 { font-size: clamp(34px, 4.2vw, 48px); line-height: 1.12; letter-spacing: -.045em; }
.kb-section-title p { max-width: 760px; margin-top: 15px; font-size: 16px; line-height: 1.85; }
.kb-route-section { border-bottom: 0; }
.kb-route-shell { padding: 32px; }
.kb-route-grid { gap: 42px 30px; }
.kb-route-step > a { min-height: 250px; padding: 24px; }
.kb-route-step h3 { font-size: 21px; }
.kb-route-step p { font-size: 14px; line-height: 1.8; }
.kb-latest-grid { gap: 24px; align-items: stretch; }
.kb-learning-card { min-height: 300px; }
.kb-learning-card-link { padding: 30px; }
.kb-learning-card h3 { font-size: 22px; line-height: 1.42; letter-spacing: -.025em; }
.kb-learning-card p { line-height: 1.85; }
.kb-about { padding: 96px 0; }

@media(max-width:980px){
  .kb-hero-grid { grid-template-columns: 1fr; }
  .kb-route-step > a { min-height: 0; }
}
@media(max-width:700px){
  .kb-hero { padding: 72px 0 64px; }
  .kb-hero h1 { font-size: clamp(38px, 10.5vw, 46px); }
  .kb-hero-copy > p { margin-top: 22px; }
  .kb-hero-points { grid-template-columns: 1fr; gap: 8px; }
  .kb-section { padding: 74px 0; }
  .kb-section-title { margin-bottom: 30px; }
  .kb-route-shell { padding: 18px; }
  .kb-learning-card { min-height: 0; }
  .kb-learning-card-link { padding: 24px; }
  .kb-about { padding: 74px 0; }
}
