/* ===================================================================
 * Vacuum Sealer Expert — elite.css
 * Typography rhythm, scorecard radar, swipeable carousel, badges, comparison slider polish.
 * =================================================================== */

/* Editorial typography rhythm */
.vse-prose > h2:first-child,
.vse-prose > h3:first-child{margin-top:0;}
.vse-prose > p:first-of-type{font-size:20px;color:var(--vse-text);}
.vse-prose > p:first-of-type::first-letter{
  font-family:var(--vse-head);font-size:3em;float:left;line-height:1;padding:6px 8px 0 0;color:var(--vse-accent);
}

/* Setup detail page */
.vse-setup{color:var(--vse-text);}
.vse-setup__hero{
  position:relative;overflow:hidden;
  padding:48px 0;background:linear-gradient(180deg, rgba(16,185,129,.08), transparent 70%);
}
.vse-setup__title{font-family:var(--vse-head);font-size:clamp(36px,4.4vw,56px);line-height:1.06;margin:8px 0;}
.vse-setup__tag{font-size:18px;color:var(--vse-text-soft);max-width:62ch;}
.vse-setup__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px;}
.vse-setup__stat{background:var(--vse-surface);border:1px solid var(--vse-line);border-radius:14px;padding:12px;}
.vse-setup__stat dt{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--vse-text-soft);}
.vse-setup__stat dd{margin:4px 0 0;font-family:var(--vse-head);font-size:22px;}

.vse-setup__cta{display:flex;gap:10px;margin-top:18px;}

.vse-setup__body{display:grid;grid-template-columns:1.4fr .8fr;gap:28px;padding:32px 0;}
@media (max-width:980px){ .vse-setup__body{grid-template-columns:1fr;} }

/* Scorecard radar */
.vse-score{background:var(--vse-bg-elev);border:1px solid var(--vse-line);border-radius:18px;padding:18px;}
.vse-score__head{margin-bottom:10px;}
.vse-score__title{font-family:var(--vse-head);font-size:20px;margin:6px 0 0;}
.vse-score__radar{width:100%;height:auto;}
.vse-score__list{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:6px;}
.vse-score__list li{display:grid;grid-template-columns:120px 1fr auto;gap:8px;align-items:center;font-size:13px;}
.vse-score__bar{height:6px;border-radius:99px;background:var(--vse-surface-2);overflow:hidden;}
.vse-score__bar span{display:block;height:100%;width:0%;background:var(--vse-grad-accent);transition:width .8s ease;}

/* Snowfall-style monthly chart (efficiency) */
.vse-mchart{background:var(--vse-bg-elev);border:1px solid var(--vse-line);border-radius:18px;padding:18px;margin-top:14px;}
.vse-mchart__title{font-family:var(--vse-head);font-size:18px;margin:0 0 10px;}
.vse-mchart__chart{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;height:160px;align-items:end;}
.vse-mchart__bar{position:relative;background:var(--vse-surface-2);border-radius:6px 6px 0 0;height:0;transition:height .8s ease;}
.vse-mchart__bar.is-peak{background:var(--vse-grad-warm);}
.vse-mchart__labels{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;margin-top:6px;font-size:10px;text-align:center;color:var(--vse-text-soft);}

/* Travel logistics 6-up */
.vse-logistics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.vse-logistics__cell{background:var(--vse-surface);border:1px solid var(--vse-line);border-radius:12px;padding:12px;}
.vse-logistics__cell dt{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--vse-text-soft);}
.vse-logistics__cell dd{margin:4px 0 0;font-family:var(--vse-head);font-size:16px;}
@media (max-width:760px){ .vse-logistics{grid-template-columns:1fr 1fr;} }

/* Storytelling */
.vse-story{margin-top:18px;}
.vse-story__quote{
  background:linear-gradient(180deg, rgba(11,18,32,.85), rgba(31,41,55,.65));border:1px solid var(--vse-line-2);border-radius:18px;padding:18px;color:#fff;
  font-family:var(--vse-head);font-size:20px;line-height:1.4;font-style:italic;
}
.vse-story__quote cite{display:block;margin-top:10px;font-style:normal;font-size:12px;color:rgba(255,255,255,.6);letter-spacing:.16em;text-transform:uppercase;}
.vse-story__row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px;}
.vse-story__cell{background:var(--vse-surface);border:1px solid var(--vse-line);border-radius:12px;padding:14px;}
.vse-story__cell h4{font-family:var(--vse-head);font-size:16px;margin:0 0 6px;}
.vse-story__tips{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.vse-story__tips li{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--vse-text-soft);}
.vse-story__tips svg{color:var(--vse-accent);}
@media (max-width:760px){ .vse-story__row,.vse-story__tips{grid-template-columns:1fr;} }

/* Visual slider */
.vse-vslider{position:relative;}
.vse-vslider__row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;}

/* Save-to-compare */
.vse-cmp__save.is-saved{color:var(--vse-accent);}

/* Editor tip callout shortcode */
.vse-tip{
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:flex-start;
  background:linear-gradient(135deg, rgba(16,185,129,.08), rgba(59,130,246,.06));
  border:1px solid rgba(16,185,129,.32);border-radius:18px;padding:18px;margin:24px 0;
  position:relative;overflow:hidden;
}
.vse-tip::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--vse-grad-accent);
}
.vse-tip__icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--vse-grad-accent);color:#fff;flex:0 0 auto;}
.vse-tip__eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--vse-accent);font-weight:700;}
.vse-tip__content{margin-top:4px;color:var(--vse-text);font-size:15.5px;line-height:1.6;}
.vse-tip__content p{margin:.4em 0;}
.vse-tip__cite{display:block;margin-top:8px;font-size:12px;color:var(--vse-text-soft);font-style:normal;}

/* Inline comparison shortcode */
.vse-icompare{background:var(--vse-bg-elev);border:1px solid var(--vse-line-2);border-radius:18px;padding:18px;margin:24px 0;}
.vse-icompare__eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--vse-text-soft);}
.vse-icompare__title{font-family:var(--vse-head);font-size:22px;margin:4px 0 12px;}
.vse-icompare__title span{color:var(--vse-text-mute);font-size:14px;font-weight:400;margin:0 6px;}
.vse-icompare__table{width:100%;border-collapse:collapse;font-size:14px;}
.vse-icompare__table th,.vse-icompare__table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--vse-line);}
.vse-icompare__table th{color:var(--vse-text-soft);font-weight:500;font-size:12px;}
.vse-icompare__table thead th{text-transform:uppercase;letter-spacing:.12em;color:var(--vse-text);font-family:var(--vse-head);font-size:14px;}
.vse-icompare__cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}

/* Byline testing row spacing */
.vse-byline__testing{padding-top:4px;}

/* How We Test page */
.vse-howtest__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:28px 24px;}
@media (max-width:980px){.vse-howtest__steps{grid-template-columns:1fr 1fr;}}
@media (max-width:680px){.vse-howtest__steps{grid-template-columns:1fr;padding:18px 16px;}}
.vse-howtest__step{
  position:relative;background:var(--vse-bg-elev);border:1px solid var(--vse-line);border-radius:18px;padding:18px;
  display:flex;flex-direction:column;gap:8px;
}
.vse-howtest__num{position:absolute;top:14px;right:14px;font-family:var(--vse-head);font-size:36px;color:transparent;background:var(--vse-grad-accent);-webkit-background-clip:text;background-clip:text;font-weight:700;line-height:1;letter-spacing:-.02em;}
.vse-howtest__icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--vse-grad-accent);color:#fff;}
.vse-howtest__title{font-family:var(--vse-head);font-size:20px;margin:6px 0 0;}
.vse-howtest__desc{color:var(--vse-text-soft);font-size:14.5px;margin:0;}
.vse-howtest__kpi{display:inline-flex;align-self:flex-start;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--vse-accent);background:rgba(16,185,129,.1);padding:5px 10px;border-radius:99px;margin-top:6px;}

.vse-howtest__axes{padding:32px 0;background:linear-gradient(180deg, var(--vse-bg-elev), transparent);}
.vse-howtest__axes header{margin-bottom:14px;}
.vse-howtest__axislist{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
@media (max-width:680px){.vse-howtest__axislist{grid-template-columns:1fr;}}
.vse-howtest__axislist li{display:grid;grid-template-columns:auto 1fr 120px;gap:10px;align-items:center;padding:10px 14px;background:var(--vse-surface);border:1px solid var(--vse-line);border-radius:12px;}
.vse-howtest__axis-icon{color:var(--vse-accent);}
.vse-howtest__axis-bar{height:5px;border-radius:99px;background:var(--vse-surface-2);overflow:hidden;}
.vse-howtest__axis-bar span{display:block;height:100%;width:var(--w);background:var(--vse-grad-accent);}
.vse-howtest__cta{padding:36px 0 48px;text-align:center;}
.vse-howtest__cta h3{font-family:var(--vse-head);font-size:26px;margin:0 0 6px;}
.vse-howtest__cta p{color:var(--vse-text-soft);max-width:50ch;margin:0 auto 14px;}

/* Continue Learning hub block */
.vse-cont{
  background:linear-gradient(135deg, rgba(59,130,246,.06), rgba(16,185,129,.04));
  border:1px solid rgba(59,130,246,.25);border-radius:18px;padding:18px;margin:28px 0;
}
.vse-cont__eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--vse-tech);font-weight:700;}
.vse-cont__title{font-family:var(--vse-head);font-size:20px;margin:4px 0 12px;}
.vse-cont__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
@media (max-width:680px){.vse-cont__grid{grid-template-columns:1fr;}}
.vse-cont__card{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  padding:12px 14px;background:var(--vse-bg-elev);border:1px solid var(--vse-line);border-radius:12px;
  text-decoration:none;color:var(--vse-text);transition:transform .2s ease, border-color .2s ease;
}
.vse-cont__card:hover{transform:translateY(-2px);border-color:var(--vse-tech);}
.vse-cont__icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--vse-grad-accent);color:#fff;}
.vse-cont__label{font-weight:600;font-size:14px;}
.vse-cont__arrow{color:var(--vse-text-mute);}

/* Accessory spotlight */
.vse-spotlight{
  background:var(--vse-surface);border:1px solid var(--vse-line);border-radius:18px;padding:14px;margin:24px 0;
}
.vse-spotlight__head{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.vse-spotlight__icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--vse-grad-accent);color:#fff;}
.vse-spotlight__eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--vse-text-soft);font-weight:700;}
.vse-spotlight__title{font-family:var(--vse-head);font-size:17px;margin:2px 0 0;}
.vse-spotlight__row{display:flex;flex-wrap:wrap;gap:6px;}
.vse-spotlight__pill{
  display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:99px;
  background:var(--vse-bg-elev);border:1px solid var(--vse-line);text-decoration:none;color:var(--vse-text);font-size:13px;
  transition:transform .2s ease, border-color .2s ease;
}
.vse-spotlight__pill:hover{transform:translateY(-1px);border-color:var(--vse-accent);}
.vse-spotlight__pill svg:first-of-type{color:var(--vse-accent);}

/* Prose visual separators (subtle hairline before each H2 except first) */
.vse-prose h2{position:relative;padding-top:1.6em;}
.vse-prose h2::before{
  content:"";position:absolute;left:0;top:0;width:48px;height:2px;border-radius:99px;background:var(--vse-grad-accent);opacity:.85;
}
.vse-prose > h2:first-child{padding-top:0;}
.vse-prose > h2:first-child::before{display:none;}
.vse-prose h3{position:relative;padding-left:14px;}
.vse-prose h3::before{
  content:"";position:absolute;left:0;top:.45em;bottom:.45em;width:3px;border-radius:99px;background:var(--vse-accent);opacity:.7;
}
