/* PowerLMS home page (src/products/learn/home.ts). Light page with deep-teal bands; Archivo for display, Inter for text.
   Colors and motion tokens live in lms-polish.css. */
.pl-body { background: var(--pl-cream); color: #10201F; --ink: #10201F; --ink-2: #33433F; --ink-3: #5B6B67; --line: #DCE3E0; }
.pl-body h1, .pl-body h2, .pl-body h3 { font-family: var(--display); color: inherit; }
.pl-wrap { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
.pl-skip { position: absolute; left: -9999px; top: 8px; z-index: 50; background: #fff; color: var(--pl-night); padding: 10px 14px; border-radius: 4px; font-weight: 700; }
.pl-skip:focus { left: 8px; }
.pl-body :focus-visible { outline: 3px solid var(--pl-gold); outline-offset: 2px; }

/* ---- header ---- */
.pl-head { position: sticky; top: 0; z-index: 20; background: rgba(5, 36, 33, .96); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid rgba(231, 181, 71, .28); }
.pl-head-in { max-width: 1160px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; gap: 28px; }
.pl-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: #fff; }
.pl-word { font: 800 21px/1 var(--display); letter-spacing: -.02em; font-stretch: 100%; }
.pl-word b { color: var(--pl-gold); font-weight: 800; }
.pl-nav { display: flex; gap: 22px; }
.pl-nav a, .pl-login { color: rgba(255,255,255,.82); text-decoration: none; font: 600 14.5px/1 var(--text); }
.pl-nav a:hover, .pl-login:hover { color: #fff; }
.pl-head-cta { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.pl-btn { height: 44px; padding: 0 20px; font-size: 15px; }
.pl-head .pl-btn { height: 38px; padding: 0 16px; font-size: 14px; }
.pl-btn-gold { background: linear-gradient(180deg, #F3CC6E 0%, var(--pl-gold) 55%, #CF9C2E 100%); color: #1E1503; border: 1px solid #C8922A; box-shadow: 0 1px 0 rgba(255,255,255,.4) inset, 0 8px 18px -10px rgba(231,181,71,.9); }
.pl-btn-gold:hover { background: linear-gradient(180deg, #F6D684 0%, #EDC15B 55%, #D7A63A 100%); color: #1E1503; }
.pl-btn-line { background: rgba(255,255,255,.04); color: #fff; border: 1px solid rgba(255,255,255,.42); }
.pl-btn-line:hover { background: rgba(255,255,255,.1); border-color: #fff; color: #fff; }
.pl-btn svg { flex: none; }

/* ---- hero ---- */
.pl-hero { position: relative; overflow: hidden; color: #fff; padding: 76px 0 56px; border-bottom: 3px solid var(--pl-gold);
  background: radial-gradient(900px 520px at 88% 0%, rgba(20, 137, 127, .55), transparent 62%), radial-gradient(700px 420px at 0% 100%, rgba(231, 181, 71, .16), transparent 60%), linear-gradient(140deg, var(--pl-night) 0%, var(--pl-night-2) 55%, #0C4A44 100%); }
.pl-guil { position: absolute; inset: 0; width: 100%; height: 100%; color: #fff; opacity: .075; pointer-events: none;
  -webkit-mask-image: radial-gradient(120% 100% at 70% 30%, #000 30%, rgba(0,0,0,.4) 70%, transparent 100%); mask-image: radial-gradient(120% 100% at 70% 30%, #000 30%, rgba(0,0,0,.4) 70%, transparent 100%);
  animation: pl-drift 60s ease-in-out infinite alternate; }
.pl-guil-dim { opacity: .05; }
@keyframes pl-drift { from { transform: translate3d(0, 0, 0) scale(1.02); } to { transform: translate3d(-2%, -1.5%, 0) scale(1.06); } }
.pl-hero-in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 56px; align-items: center; }
.pl-eyebrow { margin: 0 0 14px; font: 800 12px/1.3 var(--text); letter-spacing: .16em; text-transform: uppercase; color: var(--pl-gold-deep); }
.pl-hero .pl-eyebrow, .pl-band .pl-eyebrow { color: var(--pl-gold); }
.pl-hero h1 { font-size: clamp(42px, 6.4vw, 76px); line-height: .98; letter-spacing: -.035em; font-weight: 900; margin: 0 0 22px; text-wrap: balance; }
.pl-hero h1 span { display: block; }
.pl-hero h1 span + span { color: var(--pl-gold); }
.pl-lede { font-size: clamp(17px, 1.6vw, 19px); line-height: 1.6; color: rgba(255,255,255,.86); max-width: 600px; margin: 0 0 30px; }
.pl-cta-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: 540px; }
.pl-cta-pair .btn { width: 100%; height: 50px; font-size: 16px; }
.pl-cta-left { grid-template-columns: minmax(0, 270px); }
.pl-hero-note { margin: 16px 0 0; color: rgba(255,255,255,.66); font-size: 14px; }

/* hero picture */
.pl-art { position: relative; min-height: 560px; }
.pl-win { position: relative; margin-left: auto; width: min(100%, 430px); background: #fff; color: #10201F; border-radius: 12px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6), 0 0 0 1px rgba(231,181,71,.3); overflow: hidden; }
.pl-win-top { display: flex; align-items: center; gap: 6px; padding: 11px 14px; background: #F2F5F4; border-bottom: 1px solid #E2E8E6; font: 600 12px var(--text); color: #5B6B67; }
.pl-win-top i { width: 9px; height: 9px; border-radius: 50%; background: #CFD8D5; }
.pl-win-top span { margin-left: 8px; }
.pl-win-body { padding: 20px 22px 18px; }
.pl-win-k { margin: 0; font: 700 11px var(--text); letter-spacing: .12em; text-transform: uppercase; color: var(--pl-teal); }
.pl-win-t { margin: 4px 0 12px; font: 800 20px/1.2 var(--display); letter-spacing: -.01em; }
.pl-prog { height: 8px; border-radius: 99px; background: #E6ECEA; overflow: hidden; }
.pl-prog i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--pl-teal), #18A194); }
.pl-win-s { margin: 8px 0 12px; font-size: 13px; color: #5B6B67; }
.pl-win-s b { color: #10201F; }
.pl-win-s span { float: right; }
.pl-rows { list-style: none; margin: 0; padding: 0; }
.pl-rows li { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid #EEF2F1; font-size: 14px; }
.pl-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid #CFD8D5; display: grid; place-items: center; flex: none; }
.pl-rows li.done .pl-dot { background: var(--pl-teal); border-color: var(--pl-teal); }
.pl-rk { color: #5B6B67; display: grid; }
.pl-quiz { position: absolute; left: 0; bottom: -6px; width: 252px; background: #fff; color: #10201F; border-radius: 10px; padding: 14px 16px 10px; box-shadow: 0 30px 60px -24px rgba(0,0,0,.65); border-top: 4px solid var(--pl-gold); animation: pl-float 8s ease-in-out infinite; }
.pl-quiz-k { margin: 0; font: 700 10.5px var(--text); letter-spacing: .12em; text-transform: uppercase; color: var(--pl-gold-deep); }
.pl-quiz-q { margin: 4px 0 8px; font: 700 14px/1.3 var(--display); }
.pl-opt { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; padding: 6px 8px; border: 1px solid #E2E8E6; border-radius: 4px; font-size: 13px; }
.pl-opt i { width: 14px; height: 14px; border: 2px solid #B9C5C1; border-radius: 3px; flex: none; }
.pl-opt i.r { border-radius: 50%; }
.pl-opt.on { border-color: var(--pl-teal); background: #EEF8F6; }
.pl-opt.on i { border-color: var(--pl-teal); background: var(--pl-teal) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 12.5l4.5 4.5L19 7' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / 10px no-repeat; }
.pl-cert { position: absolute; right: -8px; bottom: -6px; width: 248px; aspect-ratio: 1.42; background: #FFFEF8; border-radius: 4px; padding: 7px; box-shadow: 0 30px 60px -22px rgba(0,0,0,.7); transform: rotate(3deg); animation: pl-float 9s ease-in-out -3s infinite; }
.pl-cert-in { position: relative; height: 100%; border: 2px solid var(--pl-night-2); outline: 1px solid var(--pl-gold); outline-offset: -6px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 4px; color: #10201F;
  background: repeating-radial-gradient(circle at 50% 120%, transparent 0 5px, rgba(15,118,110,.05) 5px 6px); }
.pl-cert-k { font: 700 8.5px var(--text); letter-spacing: .18em; text-transform: uppercase; color: var(--pl-teal-ink); }
.pl-cert-n { font: italic 700 21px/1.1 Georgia, 'Times New Roman', serif; }
.pl-cert-l { width: 60%; height: 1px; background: var(--pl-gold); }
.pl-cert-v { font: 600 7.5px var(--text); color: #5B6B67; letter-spacing: .04em; margin-top: 10px; }
.pl-cert-seal { position: absolute; right: 18px; bottom: 16px; width: 38px; height: 38px; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #F7DE95, var(--pl-gold) 45%, #A9781E 100%); box-shadow: 0 0 0 3px #FFFEF8, 0 0 0 4px rgba(169,120,30,.6); }
.pl-cert-seal::after { content: ""; position: absolute; inset: 9px; border-radius: 50%; border: 1px dashed rgba(90,60,10,.55); }
@keyframes pl-float { 0%, 100% { transform: translateY(0) rotate(var(--rot, 0deg)); } 50% { transform: translateY(-8px) rotate(var(--rot, 0deg)); } }
.pl-cert { --rot: 3deg; }

/* stats */
.pl-stats { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 64px 0 0; }
.pl-stats > div { position: relative; padding: 20px 20px 18px; border: 1px solid rgba(231,181,71,.28); border-radius: var(--pl-r-card); background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); }
.pl-stats > div::before { content: ""; position: absolute; left: 20px; top: 0; width: 34px; height: 3px; background: var(--pl-gold); border-radius: 0 0 3px 3px; }
.pl-stats dt { font: 900 46px/1 var(--display); letter-spacing: -.03em; color: var(--pl-gold); }
/* Gradient on the number itself: background-clip text does not reach an animated child. */
.pl-stats dt span, .pl-stats dt small { background: linear-gradient(180deg, #F8E3A4, var(--pl-gold) 60%, #B98A28); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pl-stats dt small { font-size: 28px; }
.pl-stats dd { margin: 8px 0 0; color: rgba(255,255,255,.78); font-size: 14px; line-height: 1.45; }

/* ---- sections ---- */
.pl-sec { padding: 96px 0; }
.pl-sec-tint { background: linear-gradient(180deg, #EFF5F3 0%, #F6F8F5 100%); border-top: 1px solid #E2EAE7; border-bottom: 1px solid #E2EAE7; }
.pl-head2 { max-width: 720px; margin: 0 0 44px; }
.pl-head2 h2, .pl-split-copy h2, .pl-demo h2 { font-size: clamp(30px, 3.8vw, 44px); line-height: 1.06; letter-spacing: -.028em; font-weight: 850; margin: 0 0 14px; text-wrap: balance; }
.pl-head2 p, .pl-split-copy > p, .pl-demo-copy > p { font-size: 17.5px; line-height: 1.6; color: var(--ink-2); margin: 0; }
.pl-center { margin-left: auto; margin-right: auto; text-align: center; }

/* lesson types */
.pl-kinds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pl-kind { position: relative; background: #fff; border: 1px solid #E1E8E5; border-radius: var(--pl-r-card); padding: 24px 24px 22px; box-shadow: var(--pl-shadow); overflow: hidden; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.pl-kind::after { content: ""; position: absolute; left: 24px; bottom: 0; height: 3px; width: 0; background: var(--pl-gold); transition: width .35s ease; }
.pl-kind:hover { transform: translateY(-4px); box-shadow: var(--pl-shadow-hi); border-color: #C9D6D2; }
.pl-kind:hover::after { width: calc(100% - 48px); }
.pl-kind-ic, .pl-feat-ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 10px; color: var(--pl-gold); background: linear-gradient(135deg, var(--pl-night-2), var(--pl-teal)); box-shadow: 0 0 0 4px #fff, 0 0 0 5px rgba(231,181,71,.5), 0 10px 20px -10px rgba(6,44,41,.7); margin-bottom: 16px; }
.pl-kind h3 { font-size: 19px; margin: 0 0 6px; }
.pl-kind p { margin: 0; font-size: 15px; line-height: 1.58; color: var(--ink-2); }

/* split layouts */
.pl-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.pl-split-rev .pl-split-copy { order: 2; }
.pl-split-copy .pl-cta-pair { margin-top: 28px; }
.pl-ticks { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.pl-ticks li { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; line-height: 1.45; color: var(--ink-2); }
.pl-ticks svg { flex: none; margin-top: 2px; color: var(--pl-teal); stroke-width: 2.6; }

/* question types */
.pl-qgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pl-qcard { background: #fff; border: 1px solid #E1E8E5; border-radius: var(--pl-r-card); padding: 16px 16px 12px; box-shadow: var(--pl-shadow); border-top: 3px solid var(--pl-teal); }
.pl-qcard:last-child:nth-child(odd) { grid-column: 1 / -1; }
.pl-qcard-k { margin: 0 0 6px; font: 800 11px var(--text); letter-spacing: .12em; text-transform: uppercase; color: var(--pl-teal-ink); }
.pl-q { margin: 0 0 10px; font: 700 15px/1.35 var(--display); }
.pl-tf { display: flex; gap: 8px; margin: 0 0 6px; }
.pl-tf span { flex: 1; text-align: center; padding: 7px; border: 1px solid #DCE3E0; border-radius: 4px; font-size: 13.5px; font-weight: 600; }
.pl-tf span.on { background: var(--pl-teal); border-color: var(--pl-teal); color: #fff; }
.pl-blank, .pl-short { margin: 0 0 6px; padding: 8px 10px; border: 1px solid #C9D6D2; border-radius: 4px; font-size: 14px; background: #FBFCFB; }
.pl-blank { display: inline-block; min-width: 120px; font-weight: 700; color: var(--pl-teal-ink); border-bottom: 2px solid var(--pl-teal); }
.pl-short { color: var(--ink-3); min-height: 44px; }

/* feature grid */
.pl-feats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pl-feat { position: relative; background: #fff; border: 1px solid #E1E8E5; border-radius: var(--pl-r-card); padding: 26px 26px 24px; box-shadow: var(--pl-shadow); overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; scroll-margin-top: 80px; }
.pl-feat::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--pl-teal), var(--pl-night-2)); }
.pl-feat:hover { transform: translateY(-4px); box-shadow: var(--pl-shadow-hi); }
.pl-feat-k { margin: 0 0 6px; font: 800 11px/1.3 var(--text); letter-spacing: .14em; text-transform: uppercase; color: var(--pl-gold-deep); }
.pl-feat h3 { font-size: 20px; line-height: 1.22; margin: 0 0 10px; letter-spacing: -.01em; }
.pl-feat > p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.pl-feat .pl-ticks { margin-top: 16px; gap: 8px; }
.pl-feat .pl-ticks li { font-size: 14.5px; }

/* dark band: build with Claude or ChatGPT */
.pl-band { position: relative; overflow: hidden; padding: 96px 0; color: #fff; border-top: 3px solid var(--pl-gold); border-bottom: 3px solid var(--pl-gold);
  background: radial-gradient(800px 420px at 100% 0%, rgba(231,181,71,.14), transparent 60%), linear-gradient(135deg, var(--pl-night) 0%, #0B4A44 100%); }
.pl-band .pl-wrap { position: relative; z-index: 1; }
.pl-band h2 { color: #fff; }
.pl-band .pl-split-copy > p { color: rgba(255,255,255,.82); }
.pl-chat { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); border-radius: 12px; padding: 22px; display: grid; gap: 12px; box-shadow: 0 30px 70px -30px rgba(0,0,0,.6); }
.pl-bub { margin: 0; padding: 12px 15px; border-radius: 10px; font-size: 15px; line-height: 1.5; max-width: 88%; }
.pl-bub.me { justify-self: end; background: var(--pl-gold); color: #1E1503; border-bottom-right-radius: 3px; }
.pl-bub.ai { background: #fff; color: #10201F; border-bottom-left-radius: 3px; }
.pl-tool { margin: 0; display: inline-flex; align-items: center; gap: 6px; justify-self: start; padding: 5px 10px; border-radius: 4px; background: rgba(255,255,255,.1); color: rgba(255,255,255,.85); font: 600 12px ui-monospace, SFMono-Regular, Menlo, monospace; }

/* payments */
.pl-pay { display: flex; flex-wrap: wrap; gap: 12px; align-content: center; justify-content: center; padding: 34px; border-radius: 14px; background: #fff; border: 1px solid #E1E8E5; box-shadow: var(--pl-shadow-hi); }
.pl-pay span { padding: 13px 18px; border-radius: 4px; border: 1px solid #D7E0DD; background: linear-gradient(180deg, #fff, #F4F7F6); font: 700 15px var(--display); color: var(--pl-night-2); box-shadow: 0 1px 0 #fff inset, 0 6px 14px -10px rgba(6,44,41,.5); }
.pl-pay span:nth-child(3n+1) { border-color: rgba(15,118,110,.4); }
.pl-pay span:nth-child(4) { border-color: rgba(231,181,71,.7); }

/* demo course */
.pl-demo { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 48px; align-items: center; padding: 44px; border-radius: 14px; background: #fff; border: 1px solid #E1E8E5; box-shadow: var(--pl-shadow-hi); position: relative; overflow: hidden; }
.pl-demo::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: linear-gradient(180deg, var(--pl-gold), var(--pl-teal)); }
.pl-demo-copy .pl-cta-pair { margin-top: 24px; }
.pl-demo-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pl-demo-list li { padding: 16px; border-radius: var(--pl-r-card); background: #F4F8F7; border: 1px solid #E1E8E5; }
.pl-demo-list b { display: block; font: 900 30px/1 var(--display); color: var(--pl-teal-ink); letter-spacing: -.02em; }
.pl-demo-list span { display: block; margin-top: 6px; font-size: 14px; color: var(--ink-2); line-height: 1.4; }

/* pricing */
.pl-prices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.pl-price { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid #E1E8E5; border-radius: var(--pl-r-card); padding: 30px 28px 26px; box-shadow: var(--pl-shadow); }
.pl-price.hot { border: 2px solid var(--pl-teal); box-shadow: var(--pl-shadow-hi); }
.pl-flag { position: absolute; top: -13px; left: 28px; margin: 0; padding: 5px 10px; border-radius: 4px; background: var(--pl-gold); color: #1E1503; font: 800 11px var(--text); letter-spacing: .12em; text-transform: uppercase; }
.pl-price h3 { font-size: 20px; margin: 0; }
.pl-amt { margin: 10px 0 4px; font: 900 48px/1 var(--display); letter-spacing: -.035em; color: var(--pl-night); }
.pl-amt small { font: 500 16px var(--text); color: var(--ink-3); letter-spacing: 0; margin-left: 2px; }
.pl-blurb { color: var(--ink-2); margin: 0 0 18px; }
.pl-price ul { list-style: none; margin: 0 0 24px; padding: 18px 0 0; border-top: 1px solid #EBF0EE; display: grid; gap: 9px; flex: 1; align-content: start; }
.pl-price li { display: flex; gap: 9px; font-size: 14.5px; line-height: 1.4; color: var(--ink-2); }
.pl-price li svg { flex: none; color: var(--pl-teal); stroke-width: 2.6; margin-top: 1px; }
.pl-block { width: 100%; }
.pl-price-note { text-align: center; color: var(--ink-3); font-size: 14px; margin: 22px auto 0; max-width: 640px; }

/* faq */
.pl-faq-wrap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 48px; align-items: start; }
.pl-faq details { background: #fff; border: 1px solid #E1E8E5; border-radius: var(--pl-r-card); margin-bottom: 10px; box-shadow: var(--pl-shadow); }
.pl-faq summary { cursor: pointer; list-style: none; padding: 18px 52px 18px 20px; font: 700 16.5px/1.35 var(--display); position: relative; }
.pl-faq summary::-webkit-details-marker { display: none; }
.pl-faq summary::after { content: ""; position: absolute; right: 20px; top: 50%; width: 10px; height: 10px; border-right: 2px solid var(--pl-teal); border-bottom: 2px solid var(--pl-teal); transform: translateY(-70%) rotate(45deg); transition: transform .2s ease; }
.pl-faq details[open] summary::after { transform: translateY(-30%) rotate(225deg); }
.pl-faq details p { margin: 0; padding: 0 20px 18px; color: var(--ink-2); line-height: 1.6; }

/* final call to action */
.pl-final { position: relative; overflow: hidden; padding: 88px 0; color: #fff; text-align: center; border-top: 3px solid var(--pl-gold);
  background: radial-gradient(700px 380px at 50% 0%, rgba(20,137,127,.5), transparent 65%), linear-gradient(135deg, var(--pl-night), #0B4A44); }
.pl-final-in { position: relative; z-index: 1; }
.pl-final h2 { color: #fff; font-size: clamp(32px, 4.4vw, 52px); letter-spacing: -.03em; line-height: 1.04; margin: 0 0 12px; }
.pl-final p { color: rgba(255,255,255,.8); font-size: 18px; margin: 0 0 28px; }
.pl-final .pl-cta-pair { margin: 0 auto; }

/* footer */
.pl-foot { background: #041F1D; color: rgba(255,255,255,.72); padding: 56px 0 26px; }
.pl-foot-in { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px; }
.pl-foot-brand p { margin: 14px 0 0; font-size: 14px; max-width: 34ch; line-height: 1.55; }
.pl-foot-col { display: grid; gap: 9px; align-content: start; }
.pl-foot-col h2 { font: 800 12px var(--text); letter-spacing: .14em; text-transform: uppercase; color: var(--pl-gold); margin: 0 0 4px; }
.pl-foot-col a { color: rgba(255,255,255,.8); text-decoration: none; font-size: 14.5px; }
.pl-foot-col a:hover { color: #fff; text-decoration: underline; }
.pl-foot-base { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 40px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); font-size: 13px; color: rgba(255,255,255,.62); }

/* ---- smaller screens ---- */
@media (max-width: 1020px) {
  .pl-hero-in { grid-template-columns: 1fr; gap: 40px; }
  .pl-art { max-width: 560px; }
  .pl-kinds, .pl-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pl-split { grid-template-columns: 1fr; gap: 40px; }
  .pl-split-rev .pl-split-copy { order: 0; }
  .pl-demo { grid-template-columns: 1fr; }
  .pl-faq-wrap { grid-template-columns: 1fr; gap: 0; }
  .pl-foot-in { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .pl-nav { display: none; }
  .pl-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pl-prices { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; }
}
@media (max-width: 640px) {
  .pl-wrap, .pl-head-in { padding-left: 16px; padding-right: 16px; }
  .pl-head-in { gap: 12px; }
  .pl-login { font-size: 14px; }
  .pl-hero { padding: 48px 0 40px; }
  .pl-sec, .pl-band { padding: 64px 0; }
  .pl-kinds, .pl-feats, .pl-qgrid { grid-template-columns: 1fr; }
  .pl-qcard:last-child:nth-child(odd) { grid-column: auto; }
  .pl-art { min-height: 0; padding-bottom: 140px; }
  .pl-win { width: 100%; }
  .pl-quiz { width: 176px; bottom: 0; left: 0; padding: 12px 12px 8px; }
  .pl-quiz-q { font-size: 13px; }
  .pl-opt { font-size: 12px; padding: 5px 6px; }
  .pl-cert { width: 164px; right: 0; bottom: 14px; }
  .pl-cert-n { font-size: 15px; }
  .pl-cert-k { font-size: 6.5px; }
  .pl-cert-v { font-size: 6px; margin-top: 4px; }
  .pl-cert-seal { width: 26px; height: 26px; right: 12px; bottom: 10px; }
  .pl-cert-seal::after { inset: 6px; }
  .pl-kind { display: grid; grid-template-columns: 46px 1fr; gap: 0 14px; padding: 18px; }
  .pl-kind-ic { grid-row: span 2; margin: 0; }
  .pl-kind h3 { margin-top: 2px; }
  .pl-foot-in { grid-template-columns: 1fr 1fr; }
  .pl-foot-brand { grid-column: 1 / -1; }
  .pl-stats { gap: 10px; margin-top: 44px; }
  .pl-stats > div { padding: 16px 14px 14px; }
  .pl-stats dt { font-size: 38px; }
  .pl-demo { padding: 28px 20px; gap: 28px; }
  .pl-demo-list { grid-template-columns: 1fr 1fr; gap: 10px; }
}
@media (max-width: 560px) {
  .pl-cta-pair, .pl-cta-left { grid-template-columns: 1fr; max-width: none; }
  .pl-head .pl-btn { padding: 0 12px; }
}
@media (max-width: 380px) {
  .pl-login { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .pl-guil, .pl-quiz, .pl-cert { animation: none !important; }
  .pl-kind, .pl-feat { transition: none; }
}
