/* HOPPT Special Battery landing page. Styles are scoped to post 5829's template. */
.hoppt-special { color: #18382f; overflow: clip; }
.hoppt-special *, .hoppt-special *::before, .hoppt-special *::after { box-sizing: border-box; }
.hoppt-special .hsb-shell { width: min(100% - 48px, 1280px); margin-inline: auto; }
.hoppt-special .hsb-breadcrumb { padding-block: 24px; color: #60746d; font-size: 14px; }
.hoppt-special .hsb-breadcrumb a { color: #0b8068; text-decoration: none; }
.hoppt-special .hsb-breadcrumb a:hover { text-decoration: underline; }
.hoppt-special .hsb-hero { position: relative; isolation: isolate; overflow: hidden; background: radial-gradient(circle at 8% 0%, #156e58 0, transparent 35%), linear-gradient(125deg, #073e33 0%, #0b5c4b 58%, #087e65 100%); color: #fff; }
.hoppt-special .hsb-hero::after { content: ''; position: absolute; z-index: -1; width: 550px; height: 550px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; right: -170px; bottom: -300px; box-shadow: 0 0 0 90px rgba(255,255,255,.025), 0 0 0 190px rgba(255,255,255,.018); }
.hoppt-special .hsb-hero__grid { display: grid; grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr); align-items: center; gap: clamp(36px,5vw,76px); min-height: 560px; padding-block: clamp(64px,7vw,104px); }
.hoppt-special .hsb-hero__copy { min-width: 0; }
.hoppt-special .hsb-eyebrow { margin: 0 0 16px; color: #078d70; font-size: 13px; line-height: 1.35; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.hoppt-special .hsb-hero .hsb-eyebrow { color: #9ce4c9; }
.hoppt-special .hsb-hero h1 { max-width: 750px; margin: 0 0 24px; color: #fff; font-size: clamp(42px,5.5vw,76px); line-height: 1.05; letter-spacing: -.045em; font-weight: 700; overflow-wrap: anywhere; }
.hoppt-special .hsb-hero__intro { max-width: 630px; margin: 0; color: #e4f5ee; font-size: clamp(17px,1.4vw,20px); line-height: 1.7; }
.hoppt-special .hsb-hero__support { display: inline-flex; max-width: 100%; margin: 28px 0 0; padding: 11px 17px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; color: #d9f2e7; font-size: 14px; line-height: 1.4; }
.hoppt-special .hsb-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; margin-top: 34px; }
.hoppt-special .hsb-button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 12px 24px; border-radius: 999px; font-weight: 700; line-height: 1.2; text-decoration: none; transition: transform .2s, background .2s, box-shadow .2s; }
.hoppt-special .hsb-button:hover, .hoppt-special .hsb-button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(0,0,0,.13); }
.hoppt-special .hsb-button--light { background: #fff; color: #07513f; }
.hoppt-special .hsb-button--light:hover { background: #e7fff5; color: #07513f; }
.hoppt-special .hsb-text-link { color: #fff; font-weight: 700; text-underline-offset: 5px; }
.hoppt-special .hsb-text-link:hover { color: #c1f4de; }
.hoppt-special .hsb-hero__visual { position: relative; min-width: 0; padding: 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 25px; background: rgba(255,255,255,.08); box-shadow: 0 30px 70px rgba(0,29,22,.25); }
.hoppt-special .hsb-hero__visual img { display: block; width: 100%; height: auto !important; aspect-ratio: 5 / 4; object-fit: cover; border-radius: 16px; }
.hoppt-special .hsb-hero__caption { position: absolute; right: 26px; bottom: 26px; left: 26px; padding: 14px 18px; border-radius: 9px; background: rgba(5,43,34,.84); color: #fff; font-size: 14px; font-weight: 600; line-height: 1.4; backdrop-filter: blur(8px); }
.hoppt-special .hsb-section-nav { border-bottom: 1px solid #dce9e4; background: #fff; }
.hoppt-special .hsb-section-nav .hsb-shell { display: flex; align-items: center; flex-wrap: wrap; gap: 6px clamp(17px,2vw,34px); padding-block: 12px; }
.hoppt-special .hsb-section-nav a { display: inline-flex; min-height: 38px; align-items: center; color: #2b4f43; font-size: 14px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.hoppt-special .hsb-section-nav a:hover, .hoppt-special .hsb-section-nav a:focus-visible { color: #07916f; }
.hoppt-special .hsb-section-nav__contact { margin-left: auto; color: #087e65 !important; }
.hoppt-special #priority-applications, .hoppt-special #why-hoppt, .hoppt-special #project-checklist, .hoppt-special #special-battery-faq, .hoppt-special #special-battery-contact { scroll-margin-top: 118px; }
.hoppt-special .hoppt-focus { background: #f4f8f6; }
.hoppt-special .hoppt-focus .content, .hoppt-special .hoppt-engineering .content, .hoppt-special .hoppt-faq .content, .hoppt-special .hoppt-focus-cta .content { width: min(100% - 48px, 1280px); }
.hoppt-special .hoppt-focus__card { border-radius: 12px; box-shadow: 0 18px 42px rgba(14,66,52,.07); transition: transform .2s, box-shadow .2s; }
.hoppt-special .hoppt-focus__card:hover { transform: translateY(-4px); box-shadow: 0 22px 50px rgba(14,66,52,.12); }
.hoppt-special .hoppt-focus__media { aspect-ratio: 16 / 8.5; }
.hoppt-special .hoppt-focus__media img { height: 100% !important; aspect-ratio: auto; }
.hoppt-special .hoppt-focus__body { min-height: 0; }
.hoppt-special .hoppt-focus__description { max-width: 53ch; }
.hoppt-special .hsb-why { padding-block: clamp(68px,7vw,110px); background: #fff; }
.hoppt-special .hsb-why__lead { display: grid; grid-template-columns: minmax(260px,.7fr) minmax(0,1.3fr); align-items: start; gap: 38px 85px; }
.hoppt-special .hsb-why h2, .hoppt-special .hsb-related h2 { margin: 0; color: #113b30; font-size: clamp(32px,3.5vw,48px); line-height: 1.15; letter-spacing: -.03em; }
.hoppt-special .hsb-why__text { color: #52665e; font-size: 17px; line-height: 1.75; }
.hoppt-special .hsb-why__text p { margin: 0 0 15px; }
.hoppt-special .hsb-why__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 42px; }
.hoppt-special .hsb-why__card { min-width: 0; padding: 30px; border: 1px solid #d9e8e1; border-radius: 10px; background: #f8fbf9; }
.hoppt-special .hsb-why__number { display: block; margin-bottom: 24px; color: #0b9875; font-size: 13px; font-weight: 700; letter-spacing: .1em; }
.hoppt-special .hsb-why__card h3 { margin: 0 0 12px; color: #183f32; font-size: 21px; line-height: 1.3; }
.hoppt-special .hsb-why__card p { margin: 0; color: #5a6d65; line-height: 1.65; }
.hoppt-special .hsb-why__links { display: flex; flex-wrap: wrap; gap: 16px 32px; margin-top: 28px; }
.hoppt-special .hsb-why__links a { color: #087f64; font-weight: 700; text-underline-offset: 4px; }
.hoppt-special .hsb-related { padding-block: clamp(58px,6vw,86px); background: #eaf5f0; }
.hoppt-special .hsb-related__inner { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 32px 80px; }
.hoppt-special .hsb-related p:not(.hsb-eyebrow) { max-width: 43ch; margin: 17px 0 0; color: #53695f; line-height: 1.65; }
.hoppt-special .hsb-related__links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.hoppt-special .hsb-related__links a { display: flex; justify-content: space-between; align-items: center; gap: 14px; min-width: 0; padding: 15px 17px; border: 1px solid #d0e6da; border-radius: 7px; background: #fff; color: #174638; font-weight: 700; line-height: 1.35; text-decoration: none; }
.hoppt-special .hsb-related__links a:hover, .hoppt-special .hsb-related__links a:focus-visible { border-color: #0ca37d; color: #087d65; }
.hoppt-special .hsb-related__links span { flex: 0 0 auto; color: #0c9676; }
.hoppt-special .hsb-contact .contact { padding-top: clamp(65px,6vw,90px); }
.hoppt-special .hsb-contact .contact .content { width: min(100% - 48px, 1280px); }
.hoppt-special :focus-visible { outline: 3px solid #27c89c; outline-offset: 3px; }
@media (max-width: 1023px) {
  .hoppt-special .hsb-hero__grid { gap: 34px; min-height: 0; }
  .hoppt-special .hsb-hero h1 { font-size: clamp(42px,5.8vw,62px); }
  .hoppt-special .hsb-why__lead, .hoppt-special .hsb-related__inner { gap: 30px; }
  .hoppt-special .hsb-why__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
  .hoppt-special .hsb-shell, .hoppt-special .hoppt-focus .content, .hoppt-special .hoppt-engineering .content, .hoppt-special .hoppt-faq .content, .hoppt-special .hoppt-focus-cta .content, .hoppt-special .hsb-contact .contact .content { width: min(100% - 32px, 1280px); }
  .hoppt-special .hsb-breadcrumb { padding-block: 17px; }
  .hoppt-special .hsb-hero__grid { grid-template-columns: 1fr; padding-block: 56px 42px; }
  .hoppt-special .hsb-hero h1 { font-size: clamp(40px,10vw,56px); }
  .hoppt-special .hsb-hero__intro { font-size: 17px; }
  .hoppt-special .hsb-hero__support { border-radius: 14px; }
  .hoppt-special .hsb-hero__visual img { aspect-ratio: 16 / 10; }
  .hoppt-special .hsb-section-nav .hsb-shell { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
  .hoppt-special .hsb-section-nav__contact { margin-left: 0; }
  .hoppt-special .hsb-why__lead, .hoppt-special .hsb-related__inner { grid-template-columns: 1fr; }
  .hoppt-special .hsb-why__grid { grid-template-columns: 1fr; margin-top: 26px; }
  .hoppt-special .hsb-related__links { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .hoppt-special .hsb-hero__actions { align-items: stretch; flex-direction: column; gap: 16px; }
  .hoppt-special .hsb-button { width: 100%; }
  .hoppt-special .hsb-hero__visual { padding: 7px; border-radius: 16px; }
  .hoppt-special .hsb-hero__visual img { border-radius: 10px; }
  .hoppt-special .hsb-hero__caption { left: 15px; right: 15px; bottom: 15px; padding: 10px 12px; font-size: 12px; }
  .hoppt-special .hsb-why__card { padding: 24px; }
}

/* Archived engineering evidence, sourced examples and reviewable model list. */
.hoppt-special #test-curves, .hoppt-special #application-examples, .hoppt-special #selection-table { scroll-margin-top: 118px; }
.hoppt-special .hsb-evidence, .hoppt-special .hsb-cases, .hoppt-special .hsb-selection { padding-block: clamp(68px, 7vw, 108px); }
.hoppt-special .hsb-evidence { background: #f4f8f6; }
.hoppt-special .hsb-cases { background: #fff; }
.hoppt-special .hsb-selection { background: #edf5f1; }
.hoppt-special .hsb-section-heading { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: end; gap: 25px 72px; margin-bottom: 36px; }
.hoppt-special .hsb-section-heading h2 { margin: 0; color: #113b30; font-size: clamp(32px, 3.5vw, 48px); line-height: 1.14; letter-spacing: -.03em; }
.hoppt-special .hsb-section-heading > p { max-width: 66ch; margin: 0; color: #52665e; font-size: 16px; line-height: 1.75; }
.hoppt-special .hsb-evidence__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.hoppt-special .hsb-evidence__card { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #d9e8e1; border-radius: 12px; background: #fff; box-shadow: 0 12px 32px rgba(14,66,52,.05); }
.hoppt-special .hsb-evidence__image { display: grid; place-items: center; min-height: 260px; padding: 20px; background: #fff; }
.hoppt-special .hsb-evidence__image img { display: block; width: 100%; max-height: 370px; height: auto !important; object-fit: contain; }
.hoppt-special .hsb-evidence__card figcaption { padding: 24px 28px 28px; border-top: 1px solid #e5eee9; }
.hoppt-special .hsb-evidence__index, .hoppt-special .hsb-cases__number { display: block; color: #087e65; font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.hoppt-special .hsb-evidence__card h3 { margin: 10px 0; color: #183f32; font-size: 21px; line-height: 1.3; }
.hoppt-special .hsb-evidence__card p { margin: 0; color: #5b6d65; font-size: 14px; line-height: 1.65; }
.hoppt-special .hsb-chargers { display: grid; grid-template-columns: minmax(230px, .45fr) minmax(0, 1fr); gap: 34px; align-items: start; margin-top: 46px; padding-top: 38px; border-top: 1px solid #cdded6; }
.hoppt-special .hsb-chargers h3 { margin: 0 0 13px; color: #183f32; font-size: 25px; }
.hoppt-special .hsb-chargers p:not(.hsb-eyebrow) { margin: 0; color: #5b6d65; line-height: 1.7; }
.hoppt-special .hsb-chargers__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hoppt-special .hsb-chargers__grid figure { min-width: 0; margin: 0; padding: 10px; border: 1px solid #d9e8e1; border-radius: 8px; background: #fff; }
.hoppt-special .hsb-chargers__grid img { display: block; width: 100%; height: 125px !important; object-fit: contain; }
.hoppt-special .hsb-chargers__grid figcaption { padding: 8px 2px 2px; color: #52665e; font-size: 12px; line-height: 1.4; }
.hoppt-special .hsb-cases__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.hoppt-special .hsb-cases__card { display: flex; flex-direction: column; min-width: 0; padding: 30px; border: 1px solid #d7e7df; border-radius: 11px; background: #f9fcfa; }
.hoppt-special .hsb-cases__card h3 { margin: 24px 0 12px; color: #143d31; font-size: 25px; line-height: 1.22; }
.hoppt-special .hsb-cases__context { margin: 0 0 16px; color: #53695f; line-height: 1.65; }
.hoppt-special .hsb-cases__specs { margin: 0 0 20px; padding: 12px 14px; border-left: 3px solid #0b9b78; background: #e9f5ef; color: #164d3b; font-weight: 700; line-height: 1.5; }
.hoppt-special .hsb-cases__review { margin-bottom: 22px; color: #52665e; line-height: 1.6; }
.hoppt-special .hsb-cases__review strong { display: block; margin-bottom: 4px; color: #173d31; }
.hoppt-special .hsb-cases__review p { margin: 0; }
.hoppt-special .hsb-cases__card > a { margin-top: auto; color: #087e65; font-weight: 700; text-underline-offset: 5px; }
.hoppt-special .hsb-selection__tools { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; margin-bottom: 16px; }
.hoppt-special .hsb-selection__tools label { color: #173d31; font-size: 14px; font-weight: 700; }
.hoppt-special .hsb-selection__tools input { width: min(100%, 340px); min-height: 44px; padding: 10px 14px; border: 1px solid #bad3c7; border-radius: 7px; background: #fff; color: #18382f; font: inherit; }
.hoppt-special .hsb-selection__tools span { margin-left: auto; color: #52665e; font-size: 13px; }
.hoppt-special .hsb-selection tbody tr[hidden] { display: none; }
.hoppt-special .hsb-selection__scroll { overflow: auto; max-width: 100%; border: 1px solid #d6e5dc; border-radius: 10px; background: #fff; }
.hoppt-special .hsb-selection table { width: 100%; min-width: 950px; border-collapse: collapse; text-align: left; }
.hoppt-special .hsb-selection thead { background: #0a5846; color: #fff; }
.hoppt-special .hsb-selection th, .hoppt-special .hsb-selection td { padding: 16px 15px; border-bottom: 1px solid #e2ebe5; vertical-align: top; font-size: 14px; line-height: 1.5; }
.hoppt-special .hsb-selection thead th { color: #fff; font-size: 13px; }
.hoppt-special .hsb-selection tbody th { color: #143d31; font-weight: 700; }
.hoppt-special .hsb-selection tbody tr:nth-child(even) { background: #f8fbf9; }
.hoppt-special .hsb-selection__status { display: inline-block; padding: 5px 9px; border-radius: 99px; background: #e4f5ec; color: #087354; font-size: 12px; font-weight: 700; white-space: nowrap; }
.hoppt-special .hsb-selection__status.is-pending { background: #fff3df; color: #865b17; }
.hoppt-special .hsb-selection td small { display: block; margin-top: 6px; color: #66766d; line-height: 1.45; }
.hoppt-special .hsb-selection__footnote { margin: 17px 0 0; color: #54695d; font-size: 14px; line-height: 1.7; }
.hoppt-special .hsb-selection__footnote a { color: #087e65; font-weight: 700; }
@media (max-width: 1023px) {
  .hoppt-special .hsb-cases__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hoppt-special .hsb-chargers { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .hoppt-special .hsb-section-heading { grid-template-columns: 1fr; margin-bottom: 26px; }
  .hoppt-special .hsb-evidence__grid, .hoppt-special .hsb-cases__grid { grid-template-columns: 1fr; }
  .hoppt-special .hsb-evidence__image { min-height: 200px; }
  .hoppt-special .hsb-chargers__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hoppt-special .hsb-cases__card { padding: 25px; }
  .hoppt-special .hsb-selection table { min-width: 850px; }
}