:root { --lf-blue:#285f7e; --lf-red:#cc000c; --lf-light:#b4d3d6; --lf-dark:#0d1a22; --lf-paper:#f3f5f5; --lf-line:#d9dede; }
.lifepo4-page { background:#fff; color:#000; }
.lifepo4-section { padding:120px 0; }
.lifepo4-eyebrow { display:block; margin-bottom:20px; color:var(--lf-blue); font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.lifepo4-eyebrow--light { color:var(--lf-light); }
.lifepo4-heading { max-width:940px; margin-bottom:64px; }
.lifepo4-heading--split { max-width:none; display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:end; }
.lifepo4-heading h2 { margin:0; font-size:clamp(2.2rem,4.2vw,4.3rem); font-weight:800; letter-spacing:-.055em; line-height:.98; }
.lifepo4-heading h3 { margin:0; font-size:clamp(2rem,3.2vw,3.3rem); font-weight:800; letter-spacing:-.05em; line-height:1; }
.lifepo4-heading > p { max-width:62ch; margin:24px 0 0; color:rgba(0,0,0,.58); font-size:1rem; line-height:1.75; }
.lifepo4-heading--split > p { margin:0 0 4px; }

/* Hero */
.lifepo4-hero { position:relative; min-height:min(880px,calc(100vh - 24px)); margin-top:72px; overflow:hidden; background:var(--lf-dark); color:#fff; }
.lifepo4-hero__media,.lifepo4-hero__shade { position:absolute; inset:0; }
.lifepo4-hero__media img { width:100%; height:100%; object-fit:cover; object-position:70% center; filter:saturate(.65) contrast(1.08); }
.lifepo4-hero__shade { background:linear-gradient(90deg,rgba(8,18,24,.99),rgba(8,18,24,.91) 41%,rgba(8,18,24,.32) 75%,rgba(8,18,24,.16)),linear-gradient(0deg,rgba(8,18,24,.58),transparent 48%); }
.lifepo4-hero__inner { position:relative; z-index:1; min-height:inherit; padding-top:42px; padding-bottom:70px; display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.34fr); grid-template-rows:auto 1fr auto; gap:24px 70px; }
.lifepo4-breadcrumbs { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:9px; color:rgba(255,255,255,.52); font-size:.68rem; line-height:1.5; }
.lifepo4-breadcrumbs a:hover { color:#fff; }
.lifepo4-hero__copy { max-width:820px; align-self:center; }
.lifepo4-hero h1 { max-width:10ch; margin:0; font-size:clamp(3.6rem,7vw,7.4rem); font-weight:800; letter-spacing:-.07em; line-height:.87; }
.lifepo4-hero h1 em { display:block; color:var(--lf-light); font-style:normal; }
.lifepo4-hero__subtitle { max-width:61ch; margin:32px 0 0; color:rgba(255,255,255,.7); font-size:1rem; line-height:1.75; }
.lifepo4-actions { margin-top:34px; display:flex; flex-wrap:wrap; gap:10px; }
.lifepo4-hero__note { margin:26px 0 0; padding-left:18px; border-left:2px solid var(--lf-light); color:rgba(255,255,255,.76); font-size:.76rem; line-height:1.5; }

/* About */
.lifepo4-about { background:#fff; }
.lifepo4-chemistry { display:grid; grid-template-columns:.7fr 2.3fr; border-top:1px solid var(--lf-line); border-left:1px solid var(--lf-line); }
.lifepo4-chemistry__source { min-height:280px; padding:28px 32px; display:flex; flex-direction:column; justify-content:flex-end; border-right:1px solid var(--lf-line); border-bottom:1px solid var(--lf-line); }
.lifepo4-chemistry__source { background:var(--lf-dark); color:#fff; }
.lifepo4-chemistry__source strong { font-size:1.5rem; letter-spacing:-.04em; line-height:1.08; }
.lifepo4-chemistry__source i { width:1px; height:54px; margin:20px 0; background:var(--lf-light); }
.lifepo4-chemistry__source small { color:rgba(255,255,255,.5); font-size:.68rem; line-height:1.55; }
.lifepo4-chemistry__options { position:relative; display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--lf-line); }
.lifepo4-chemistry__options::before { content:''; position:absolute; z-index:2; top:0; left:0; width:33.3333%; height:5px; background:var(--lf-blue); pointer-events:none; transform:translateX(0); transition:transform .42s cubic-bezier(.22,1,.36,1); }
.lifepo4-chemistry__options:has(article:nth-child(2):hover)::before { transform:translateX(100%); }
.lifepo4-chemistry__options:has(article:nth-child(3):hover)::before { transform:translateX(200%); }
.lifepo4-chemistry__options article { min-height:280px; padding:28px 26px; display:flex; flex-direction:column; border-right:1px solid var(--lf-line); background:#fff; transition:background-color .28s ease; }
.lifepo4-chemistry__options article:last-child { border:0; }
.lifepo4-chemistry__options article.is-active,
.lifepo4-chemistry__options article:hover { background:var(--lf-paper); }
.lifepo4-chemistry__options:has(article:hover) article.is-active:not(:hover) { background:#fff; }
.lifepo4-chemistry__options span { color:var(--lf-blue); font-size:.78rem; font-weight:800; }
.lifepo4-chemistry__options strong { margin-top:72px; font-size:1rem; line-height:1.35; }
.lifepo4-chemistry__options p { margin:12px 0 0; color:rgba(0,0,0,.55); font-size:.75rem; line-height:1.65; }
.lifepo4-chemistry__link { margin-top:18px; color:var(--lf-blue); font-size:.64rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }

/* Benefits */
.lifepo4-benefits { background:var(--lf-dark); color:#fff; }
.lifepo4-benefits__layout { display:grid; grid-template-columns:.78fr 1.22fr; gap:70px; align-items:stretch; }
.lifepo4-heading--compact { margin-bottom:34px; }
.lifepo4-benefits__visual { position:relative; min-height:0; overflow:hidden; background:#10222c; }
.lifepo4-benefits__visual::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(8,18,24,.8),transparent 62%); }
.lifepo4-benefits__visual img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center; filter:saturate(.76); }
.lifepo4-benefits .lifepo4-heading h2 { font-size:clamp(2.1rem,3.6vw,3.7rem); }
.lifepo4-benefits__list { margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.18); }
.lifepo4-benefits__list li { padding:24px 0; display:grid; grid-template-columns:64px 1fr; gap:20px; border-bottom:1px solid rgba(255,255,255,.18); }
.lifepo4-benefits__list > li > strong { color:var(--lf-light); font-size:1.2rem; }
.lifepo4-benefits__list h3 { margin:0 0 7px; font-size:1rem; }
.lifepo4-benefits__list p { max-width:62ch; margin:0; color:rgba(255,255,255,.56); font-size:.82rem; line-height:1.65; }
.lifepo4-warning { margin-top:62px; padding:25px 30px; display:grid; grid-template-columns:145px 1fr; gap:30px; border:1px solid rgba(180,211,214,.45); background:rgba(180,211,214,.08); }
.lifepo4-warning strong { color:var(--lf-light); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; }
.lifepo4-warning p { max-width:85ch; margin:0; color:rgba(255,255,255,.72); font-size:.81rem; line-height:1.7; }

/* Voltage */
.lifepo4-voltage { background:var(--lf-paper); }
.lifepo4-voltage__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.lifepo4-voltage__grid article { min-height:380px; padding:35px; display:flex; flex-direction:column; background:#fff; border-top:5px solid var(--lf-light); }
.lifepo4-voltage__grid article:nth-child(2) { border-color:var(--lf-blue); }
.lifepo4-voltage__grid article:nth-child(3) { border-color:var(--lf-red); }
.lifepo4-voltage__grid article:nth-child(4) { border-color:var(--lf-dark); }
.lifepo4-voltage__grid span { color:var(--lf-blue); font-size:3.3rem; font-weight:800; letter-spacing:-.07em; }
.lifepo4-voltage__grid h3 { max-width:12ch; margin:24px 0 12px; font-size:1.22rem; line-height:1.18; }
.lifepo4-voltage__grid p { max-width:31ch; margin:0; color:rgba(0,0,0,.57); font-size:.82rem; line-height:1.68; }
.lifepo4-voltage__grid small { margin-top:auto; padding-top:30px; color:rgba(0,0,0,.42); font-size:.72rem; font-weight:700; text-transform:uppercase; }
.lifepo4-voltage__grid em,.lifepo4-future-link em { color:var(--lf-red); font-size:.62rem; font-style:normal; font-weight:500; letter-spacing:0; text-transform:none; }

/* Applications */
.lifepo4-applications { background:#fff; }
.lifepo4-applications__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--lf-line); }
.lifepo4-application { position:relative; min-height:310px; padding:30px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; overflow:hidden; color:#fff; background:var(--lf-dark); }
.lifepo4-application::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(8,18,24,.94) 0%,rgba(8,18,24,.58) 48%,rgba(8,18,24,.18) 100%); transition:background .4s ease; }
.lifepo4-application img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.72); transition:transform .55s cubic-bezier(.22,1,.36,1),filter .4s ease; }
.lifepo4-application:hover img { transform:scale(1.055); filter:saturate(.95); }
.lifepo4-application:hover::after { background:linear-gradient(0deg,rgba(8,18,24,.88) 0%,rgba(8,18,24,.4) 52%,rgba(8,18,24,.08) 100%); }
.lifepo4-application span,.lifepo4-application b,.lifepo4-application em { position:relative; z-index:1; }
.lifepo4-application strong,.lifepo4-application small { display:block; }
.lifepo4-application strong { max-width:22ch; font-size:1.1rem; line-height:1.2; }
.lifepo4-application small { max-width:34ch; margin-top:9px; color:rgba(255,255,255,.68); font-size:.72rem; line-height:1.55; }
.lifepo4-application b { color:var(--lf-light); font-size:1.45rem; transition:transform .35s ease; }
.lifepo4-application:hover b { transform:translateX(5px); }
.lifepo4-application--future { cursor:default; }
.lifepo4-application--future em { position:absolute; right:22px; bottom:18px; color:rgba(0,0,0,.36); font-size:.58rem; font-style:normal; }

/* Engineering */
.lifepo4-engineering { background:#13242e; color:#fff; }
.lifepo4-engineering .lifepo4-heading > p,.lifepo4-final .lifepo4-heading > p { color:rgba(255,255,255,.58); }
.lifepo4-engineering__layout { display:block; }
.lifepo4-engineering__steps { margin:0; padding:1px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; list-style:none; background:rgba(180,211,214,.24); }
.lifepo4-engineering__steps li { position:relative; min-height:225px; padding:30px; display:flex; flex-direction:column; overflow:hidden; background:#13242e; transition:background-color .3s ease; }
.lifepo4-engineering__steps li::before { content:''; position:absolute; top:0; left:0; width:0; height:4px; background:var(--lf-light); transition:width .4s cubic-bezier(.22,1,.36,1); }
.lifepo4-engineering__steps li:hover { background:#19303c; }
.lifepo4-engineering__steps li:hover::before { width:100%; }
.lifepo4-engineering__steps > li > strong { color:var(--lf-light); font-size:1.65rem; letter-spacing:-.05em; }
.lifepo4-engineering__steps li > div { margin-top:auto; }
.lifepo4-engineering__steps h3 { margin:0 0 10px; font-size:1.05rem; }
.lifepo4-engineering__steps p { max-width:42ch; margin:0; color:rgba(255,255,255,.55); font-size:.79rem; line-height:1.62; }

/* Final */
.lifepo4-final { padding:120px 0 90px; background:var(--lf-dark); color:#fff; }
.lifepo4-production__gallery { display:grid; grid-template-columns:1.2fr .8fr .8fr; grid-template-rows:250px 250px; gap:10px; }
.lifepo4-production__gallery figure { position:relative; margin:0; overflow:hidden; background:#10222c; }
.lifepo4-production__gallery figure:first-child { grid-row:1/3; }
.lifepo4-production__gallery figure:last-child { grid-column:2/4; }
.lifepo4-production__gallery img { width:100%; height:100%; object-fit:cover; filter:saturate(.75); transition:transform .4s ease; }
.lifepo4-production__gallery figure:hover img { transform:scale(1.025); }
.lifepo4-production__gallery figcaption { position:absolute; right:14px; bottom:14px; left:14px; padding:11px 13px; background:rgba(8,18,24,.8); color:#fff; font-size:.64rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.lifepo4-production__links { margin-top:32px; display:flex; align-items:center; gap:28px; }
.lifepo4-future-link { color:var(--lf-light); font-size:.72rem; font-weight:700; text-transform:uppercase; }
.lifepo4-faq { margin-top:100px; padding-top:72px; display:grid; grid-template-columns:.7fr 1.3fr; gap:80px; border-top:1px solid rgba(255,255,255,.17); }
.lifepo4-faq details { border-top:1px solid rgba(255,255,255,.18); }
.lifepo4-faq details:last-child { border-bottom:1px solid rgba(255,255,255,.18); }
.lifepo4-faq summary { position:relative; padding:22px 48px 22px 0; cursor:pointer; list-style:none; font-size:.85rem; font-weight:600; line-height:1.45; }
.lifepo4-faq summary::-webkit-details-marker { display:none; }
.lifepo4-faq summary::after { content:'+'; position:absolute; top:16px; right:8px; color:var(--lf-light); font-size:1.45rem; font-weight:400; }
.lifepo4-faq details[open] summary::after { content:'−'; }
.lifepo4-faq details p { max-width:74ch; margin:-4px 48px 24px 0; color:rgba(255,255,255,.55); font-size:.78rem; line-height:1.7; }
.lifepo4-request { margin-top:100px; padding-top:72px; border-top:1px solid rgba(255,255,255,.17); }
.lifepo4-request__grid { display:grid; grid-template-columns:.72fr 1.28fr; gap:64px; align-items:start; }
.lifepo4-request__intro { padding:30px 0; display:flex; flex-direction:column; gap:15px; border-top:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); }
.lifepo4-request__intro strong { margin-bottom:5px; font-size:1.1rem; }
.lifepo4-request__intro span { padding-left:20px; position:relative; color:rgba(255,255,255,.58); font-size:.75rem; }
.lifepo4-request__intro span::before { content:''; position:absolute; top:.28em; left:0; width:7px; height:7px; background:var(--lf-light); }
.lifepo4-form { padding:38px; }
.lifepo4-form__actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.lifepo4-form__attach { min-height:56px; padding:0 18px; display:flex !important; align-items:center; justify-content:center; border:1px solid rgba(40,95,126,.42); color:var(--lf-blue) !important; cursor:pointer; font-size:.72rem !important; font-weight:700 !important; letter-spacing:.04em; text-align:center; text-transform:uppercase; }

@media (max-width:1180px) { .lifepo4-hero__inner{grid-template-columns:1fr 260px;gap:24px 40px}.lifepo4-heading--split{gap:48px}.lifepo4-benefits__layout,.lifepo4-request__grid{gap:42px}.lifepo4-voltage__grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:1024px) { .lifepo4-section,.lifepo4-final{padding-top:94px;padding-bottom:94px}.lifepo4-hero{min-height:800px}.lifepo4-hero__inner{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.lifepo4-heading--split,.lifepo4-benefits__layout,.lifepo4-faq,.lifepo4-request__grid{grid-template-columns:1fr}.lifepo4-heading--split{gap:24px}.lifepo4-heading--split>p{margin:0}.lifepo4-benefits__visual{position:relative;top:auto;min-height:430px}.lifepo4-applications__grid,.lifepo4-engineering__steps{grid-template-columns:repeat(2,1fr)}.lifepo4-faq{gap:42px} }
@media (max-width:768px) { .lifepo4-section,.lifepo4-final{padding-top:76px;padding-bottom:76px}.lifepo4-heading{margin-bottom:44px}.lifepo4-heading h2{font-size:clamp(2.1rem,9vw,3.4rem)}.lifepo4-hero{min-height:760px}.lifepo4-hero__media img{object-position:72% center}.lifepo4-hero__shade{background:linear-gradient(90deg,rgba(8,18,24,.97),rgba(8,18,24,.73))}.lifepo4-hero__inner{padding-top:30px;padding-bottom:48px}.lifepo4-hero h1{font-size:clamp(3rem,13vw,4.7rem)}.lifepo4-chemistry{grid-template-columns:1fr}.lifepo4-chemistry__source{min-height:240px}.lifepo4-chemistry__options{grid-column:auto}.lifepo4-chemistry__options article{min-height:280px}.lifepo4-voltage__grid{grid-template-columns:1fr}.lifepo4-voltage__grid article{min-height:260px}.lifepo4-applications__grid{grid-template-columns:1fr 1fr}.lifepo4-production__gallery{grid-template-columns:1fr 1fr;grid-template-rows:330px 220px 220px}.lifepo4-production__gallery figure:first-child{grid-column:1/-1;grid-row:auto}.lifepo4-production__gallery figure:last-child{grid-column:1/-1}.lifepo4-production__links{align-items:flex-start;flex-direction:column} }
@media (max-width:560px) { .lifepo4-section,.lifepo4-final{padding-top:64px;padding-bottom:64px}.lifepo4-heading{margin-bottom:36px}.lifepo4-heading h2{font-size:clamp(1.95rem,9.8vw,2.8rem)}.lifepo4-heading>p{font-size:.88rem;line-height:1.65}.lifepo4-breadcrumbs{gap:6px;font-size:.59rem}.lifepo4-breadcrumbs span[aria-current="page"]{width:100%}.lifepo4-hero{min-height:720px}.lifepo4-hero__media img{object-position:70% center}.lifepo4-hero__shade{background:rgba(8,18,24,.82)}.lifepo4-hero__inner{gap:16px;padding-top:24px;padding-bottom:34px}.lifepo4-hero h1{font-size:clamp(2.65rem,13vw,3.4rem)}.lifepo4-hero__subtitle{margin-top:24px;font-size:.84rem;line-height:1.6}.lifepo4-actions{margin-top:24px;flex-direction:column}.lifepo4-actions a{width:100%}.lifepo4-chemistry{grid-template-columns:1fr}.lifepo4-chemistry__source{min-height:190px}.lifepo4-chemistry__options{grid-column:auto;grid-template-columns:1fr}.lifepo4-chemistry__options::before{display:none}.lifepo4-chemistry__options article{position:relative;min-height:190px;padding:26px}.lifepo4-chemistry__options article::before{content:'';position:absolute;top:0;left:0;width:100%;height:5px;background:var(--lf-blue);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}.lifepo4-chemistry__options article.is-active::before,.lifepo4-chemistry__options article:hover::before{transform:scaleX(1)}.lifepo4-chemistry__options:has(article:hover) article.is-active:not(:hover)::before{transform:scaleX(0)}.lifepo4-chemistry__options strong{margin-top:42px}.lifepo4-benefits__visual{min-height:330px}.lifepo4-benefits__list li{grid-template-columns:42px 1fr;gap:12px}.lifepo4-warning{margin-top:42px;padding:23px;grid-template-columns:1fr;gap:12px}.lifepo4-applications__grid,.lifepo4-engineering__steps{grid-template-columns:1fr}.lifepo4-application{min-height:260px}.lifepo4-engineering__steps li{min-height:200px;padding:26px}.lifepo4-production__gallery{grid-template-columns:1fr;grid-template-rows:repeat(4,250px)}.lifepo4-production__gallery figure:first-child,.lifepo4-production__gallery figure:last-child{grid-column:auto}.lifepo4-faq{margin-top:72px;padding-top:54px}.lifepo4-faq summary{padding-right:40px}.lifepo4-request{margin-top:72px;padding-top:54px}.lifepo4-form{padding:24px 18px}.production-form__row,.lifepo4-form__actions{grid-template-columns:1fr}.lifepo4-request__grid{gap:34px} }
@media (prefers-reduced-motion:reduce) { .lifepo4-chemistry__options::before,.lifepo4-chemistry__options article,.lifepo4-chemistry__options article::before,.lifepo4-application img,.lifepo4-application::after,.lifepo4-application b,.lifepo4-engineering__steps li,.lifepo4-engineering__steps li::before,.lifepo4-production__gallery img{transition:none} }