/* Derma Inspire — standalone OEM/ODM page, scoped to avoid affecting all other pages. */
.content-page:has(.dio-oem-hero){overflow:visible}
.content-page .dio-oem-hero,.content-page .dio-oem-section,.content-page .dio-oem-process{color:#20374e}
.dio-oem-hero{position:relative;isolation:isolate}
.dio-oem-hero::before{content:"";position:absolute;z-index:-1;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);background:radial-gradient(ellipse at 98% 5%,#e2f6f8 0%,transparent 52%),linear-gradient(110deg,#f4faff 0%,#eef9ff 55%,#e4f3f9 100%)}
.dio-oem-hero-layout{padding:60px 24px 74px;display:grid;grid-template-columns:1.07fr 0.93fr;align-items:center;gap:54px;min-height:555px}
.dio-oem-breadcrumb{display:flex;align-items:center;gap:11px;font-size:11px;color:#8398ac;margin-bottom:37px}
.dio-oem-breadcrumb a:hover{color:#018aae}
.dio-oem-kicker{color:#0095b9;display:inline-flex;align-items:center;gap:11px;font-size:10px;font-weight:700;letter-spacing:2px;line-height:1.7}
.dio-oem-kicker-line{width:30px;height:1px;background:#0aa3c7}
.dio-oem-hero h1{font-size:clamp(36px,3.2vw,49px);font-weight:600;line-height:1.45;letter-spacing:-1.3px;margin:22px 0 22px;color:#1c334b}
.dio-oem-hero h1 span,.dio-oem-section h2 span{color:#078fb4}
.dio-oem-hero .dio-oem-lead{max-width:565px;font-size:15px;line-height:2.05;color:#62798f}
.dio-oem-hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:29px}
.dio-oem-btn{min-height:49px;display:inline-flex;justify-content:center;align-items:center;gap:25px;border-radius:50px;padding:12px 23px;font-size:13px;font-weight:600;transition:transform .2s ease,box-shadow .2s ease;white-space:nowrap}
.dio-oem-btn:hover{transform:translateY(-2px)}
.dio-oem-btn-main{color:white;background:linear-gradient(115deg,#007aa4,#19b2c2);box-shadow:0 10px 20px rgba(2,127,167,.14)}
.dio-oem-btn-main:hover{color:white;box-shadow:0 12px 24px rgba(2,127,167,.22)}
.dio-oem-btn-ghost{background:white;color:#127e9d;border:1px solid #cfe6ef}
.dio-oem-btn-ghost:hover{background:#f9ffff}
.dio-oem-hero-foot{display:flex;gap:10px 24px;flex-wrap:wrap;margin-top:33px;color:#70869c;font-size:11px}
.dio-oem-hero-foot span{display:inline-flex;gap:7px;align-items:center}
.dio-oem-hero-foot i{font-style:normal;font-weight:700;color:#069abb}
.dio-oem-hero-media{height:420px;position:relative;border:8px solid rgba(255,255,255,.76);border-radius:28px;box-shadow:0 22px 65px rgba(33,99,140,.12);background-image:url('assets/oem-hero.png');background-size:cover;background-position:67% center;overflow:visible}
.dio-oem-floating{position:absolute;bottom:23px;left:-27px;display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.96);border:1px solid #e5f0f6;padding:14px 19px;border-radius:14px;box-shadow:0 12px 35px rgba(12,62,91,.12)}
.dio-oem-floating-dot{display:grid;place-items:center;width:37px;height:37px;border-radius:11px;background:#e7f9fa;color:#0a9fba;font-size:21px}
.dio-oem-floating strong{display:block;font:600 10px 'DM Sans',sans-serif;letter-spacing:.7px;color:#174360}
.dio-oem-floating small{display:block;color:#8194a4;font-size:11px;margin-top:5px}
.dio-oem-section{padding:88px 24px}
.dio-oem-section-top,.dio-oem-compare-header{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:37px}
.dio-oem-section h2{font-size:clamp(28px,2.6vw,37px);line-height:1.52;color:#23384c;font-weight:600;letter-spacing:-.7px;margin:12px 0 0}
.dio-oem-section-top>p,.dio-oem-compare-header>p{max-width:365px;font-size:13px;line-height:2.05;color:#778b9f;padding-bottom:2px}
.dio-oem-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.dio-oem-card{background:#fff;border:1px solid #dfebf2;border-radius:19px;padding:32px 33px 24px;box-shadow:0 13px 38px rgba(16,65,99,.035);display:flex;flex-direction:column;min-height:312px;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.dio-oem-card:hover{border-color:#b9dbe8;box-shadow:0 15px 42px rgba(9,88,127,.09);transform:translateY(-2px)}
.dio-oem-card-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:17px}
.dio-oem-card-icon{width:51px;height:51px;border-radius:15px;background:#eaf8fc;color:#0396b9;display:grid;place-items:center}
.dio-oem-card-icon svg{width:26px;height:26px}
.dio-oem-card-no{font:600 10px 'DM Sans',sans-serif;color:#a8bfcb;letter-spacing:1.2px}
.dio-oem-card h3{font-size:21px;font-weight:600;line-height:1.5;color:#23405a;margin-bottom:8px}
.dio-oem-card>p{font-size:13px;color:#72869b;line-height:1.95;max-width:470px;min-height:70px}
.dio-oem-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:17px;margin-bottom:20px}
.dio-oem-card-tags span{display:inline-flex;padding:6px 10px;border-radius:50px;background:#f1f8fb;color:#6c90a2;font-size:10px;line-height:1.4}
.dio-oem-card>a{border-top:1px solid #e7f0f5;display:flex;align-items:center;justify-content:space-between;color:#007fa6;padding-top:17px;font-size:12px;font-weight:600;margin-top:auto}
.dio-oem-card>a span{font-size:16px}
.dio-oem-compare{padding-top:35px;padding-bottom:95px}
.dio-oem-compare-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:21px}
.dio-oem-compare-panel{position:relative;overflow:hidden;background:#eaf7fc;border:1px solid #d8edf5;border-radius:19px;padding:36px 40px 32px;min-height:315px}
.dio-oem-compare-panel::before{content:"";position:absolute;right:-75px;top:-78px;width:225px;height:225px;border:1px solid rgba(6,147,185,.16);border-radius:50%;box-shadow:0 0 0 28px rgba(6,147,185,.035),0 0 0 57px rgba(6,147,185,.025)}
.dio-oem-compare-panel-alt{background:#f4f9fb;border-color:#e0ecf1}
.dio-oem-compare-label{font:700 10px 'DM Sans',sans-serif;letter-spacing:2px;color:#0294b4}
.dio-oem-compare-panel h3{margin:14px 0 14px;font:600 clamp(25px,2.3vw,31px)/1.26 'DM Sans',sans-serif;color:#1d3d55;letter-spacing:-.7px}
.dio-oem-compare-panel .dio-oem-compare-th{font-size:15px;font-weight:600;color:#0e87aa;margin-bottom:8px}
.dio-oem-compare-panel p{font-size:13px;line-height:1.95;color:#688398;max-width:440px}
.dio-oem-compare-panel>a{display:inline-flex;gap:17px;color:#007fa6;font-size:12px;font-weight:600;margin-top:22px;border-bottom:1px solid #98cfdf;padding-bottom:4px}
.dio-oem-process{position:relative;isolation:isolate}
.dio-oem-process::before{content:"";position:absolute;z-index:-1;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);background:#f3f9fc}
.dio-oem-process .dio-oem-section{padding-top:73px;padding-bottom:83px}
.dio-oem-process .dio-oem-section-top{margin-bottom:34px}
.dio-oem-text-link{color:#0086a7;font-weight:600;font-size:12px;white-space:nowrap;border-bottom:1px solid #a0d8e5;padding-bottom:6px}
.dio-oem-process-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;position:relative}
.dio-oem-process-grid li{position:relative;background:#fff;padding:25px 23px;border:1px solid #e2edf4;border-radius:16px;min-height:174px}
.dio-oem-step-num{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#e9f8fb;color:#0a90b1;font:600 15px 'DM Sans',sans-serif;margin-bottom:17px}
.dio-oem-process-grid strong{display:block;font-size:15px;font-weight:600;color:#223e58}
.dio-oem-process-grid p{font-size:12px;line-height:1.85;color:#7b90a1;margin-top:6px}
.dio-oem-discover{display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:42px;padding-top:79px;padding-bottom:78px}
.dio-oem-discover h2{margin:13px 0 14px}
.dio-oem-discover p{font-size:13px;line-height:2;color:#73889b;max-width:520px}
.dio-oem-discover-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.dio-oem-discover-links a{border:1px solid #cce5ee;padding:12px 19px;border-radius:30px;display:inline-flex;align-items:center;gap:20px;font-size:12px;font-weight:600;color:#0687a9}
.dio-oem-discover-links a:first-child{background:#eff9fc}
.dio-oem-discover-links a:hover{background:#daf4f9}
.dio-oem-discover-image{height:240px;border-radius:22px;background-image:url('assets/ingredient-atlas.png');background-position:100% 100%;background-size:200% 200%;box-shadow:0 10px 35px rgba(18,83,122,.09)}
.dio-oem-bottom{background:linear-gradient(115deg,#123f5b,#077e9e);color:white!important;border-radius:23px;display:flex;justify-content:space-between;gap:30px;align-items:center;margin:0 24px 88px;padding:49px 52px!important;position:relative;overflow:hidden}
.dio-oem-bottom::before{content:"";position:absolute;width:340px;height:340px;border:1px solid rgba(255,255,255,.13);border-radius:50%;right:-90px;top:-160px;pointer-events:none;box-shadow:0 0 0 45px rgba(255,255,255,.035),0 0 0 90px rgba(255,255,255,.025)}
.dio-oem-bottom .dio-oem-kicker{color:#a0e9ef}
.dio-oem-bottom h2{color:white!important;font-size:clamp(27px,2.8vw,36px);margin:14px 0 12px}
.dio-oem-bottom h2 span{color:#a1e1e9!important}
.dio-oem-bottom p{color:#d5e7ee;font-size:12px;max-width:535px}
.dio-oem-bottom-actions{display:flex;align-items:flex-start;flex-direction:column;gap:15px;position:relative;z-index:1;flex:none}
.dio-oem-btn-light{background:#fff;color:#087b9b;min-width:205px}
.dio-oem-phone{font-size:12px;color:#edfaff;border-bottom:1px solid rgba(255,255,255,.4);padding-bottom:5px}
@media(max-width:1100px){.dio-oem-hero-layout{gap:28px}.dio-oem-hero-media{height:382px}.dio-oem-hero h1{font-size:39px}.dio-oem-hero .dio-oem-lead{font-size:14px}.dio-oem-compare-panel{padding:30px}.dio-oem-bottom{padding:40px 35px!important}}
@media(max-width:850px){.dio-oem-hero-layout{grid-template-columns:1fr;gap:30px;padding-top:40px;padding-bottom:52px}.dio-oem-breadcrumb{margin-bottom:25px}.dio-oem-hero-media{height:360px;max-width:100%;background-position:center 50%}.dio-oem-floating{left:17px;bottom:16px}.dio-oem-hero h1{font-size:42px}.dio-oem-section{padding:57px 24px}.dio-oem-section-top,.dio-oem-compare-header{align-items:start;flex-direction:column;gap:12px;margin-bottom:27px}.dio-oem-section-top>p,.dio-oem-compare-header>p{max-width:630px}.dio-oem-process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dio-oem-discover{gap:25px}.dio-oem-bottom{margin-bottom:55px}}
@media(max-width:600px){.dio-oem-hero-layout{padding:27px 18px 42px}.dio-oem-breadcrumb{margin-bottom:22px}.dio-oem-kicker{font-size:9px;letter-spacing:1.3px}.dio-oem-hero h1{font-size:32px;line-height:1.48;letter-spacing:-.6px;margin:16px 0}.dio-oem-hero .dio-oem-lead{font-size:13px;line-height:1.9}.dio-oem-hero-actions{gap:9px;margin-top:23px}.dio-oem-btn{padding:11px 18px;font-size:12px;min-height:46px;gap:15px}.dio-oem-hero-foot{gap:8px 13px;margin-top:22px;font-size:10px}.dio-oem-hero-media{height:260px;border-width:5px;border-radius:19px;background-position:69% 50%}.dio-oem-floating{padding:10px 12px;border-radius:12px;bottom:12px;left:10px}.dio-oem-floating-dot{width:30px;height:30px}.dio-oem-floating strong{font-size:9px}.dio-oem-floating small{font-size:9px}.dio-oem-section{padding:46px 18px}.dio-oem-section h2{font-size:27px;letter-spacing:-.3px}.dio-oem-section-top>p,.dio-oem-compare-header>p{font-size:12px}.dio-oem-card-grid,.dio-oem-compare-grid{grid-template-columns:1fr;gap:13px}.dio-oem-card{min-height:0;padding:23px 22px 19px;border-radius:15px}.dio-oem-card-head{margin-bottom:13px}.dio-oem-card-icon{width:44px;height:44px}.dio-oem-card h3{font-size:19px}.dio-oem-card>p{min-height:0;font-size:12px}.dio-oem-card-tags{margin-top:14px;margin-bottom:15px}.dio-oem-compare{padding-top:17px;padding-bottom:54px}.dio-oem-compare-panel{padding:26px 23px;min-height:0;border-radius:15px}.dio-oem-compare-panel h3{font-size:26px}.dio-oem-compare-panel .dio-oem-compare-th{font-size:14px}.dio-oem-process .dio-oem-section{padding-top:50px;padding-bottom:52px}.dio-oem-process-grid{gap:10px}.dio-oem-process-grid li{padding:18px 15px;min-height:170px}.dio-oem-step-num{width:32px;height:32px;margin-bottom:15px;font-size:12px}.dio-oem-process-grid strong{font-size:13px}.dio-oem-process-grid p{font-size:11px}.dio-oem-text-link{font-size:11px}.dio-oem-discover{grid-template-columns:1fr;gap:22px}.dio-oem-discover-image{height:190px;order:-1}.dio-oem-bottom{margin:0 18px 42px;padding:29px 24px!important;align-items:stretch;flex-direction:column;gap:24px;border-radius:18px}.dio-oem-bottom h2{font-size:28px}.dio-oem-bottom-actions{gap:15px}.dio-oem-btn-light{min-width:0}.dio-oem-bottom p{font-size:12px}}
@media(max-width:380px){.dio-oem-hero h1{font-size:28px}.dio-oem-hero-actions>.dio-oem-btn{width:100%}.dio-oem-hero-media{height:225px}.dio-oem-hero-foot{gap:8px 10px}.dio-oem-process-grid{grid-template-columns:1fr}.dio-oem-process-grid li{min-height:0}}
@media(prefers-reduced-motion:reduce){.dio-oem-card,.dio-oem-btn{transition:none!important}}