/* Oil Slick theme for traffic-titans.com (2026-09-10). Overrides the inline base styles of every page. */
:root,:root[data-theme="light"],:root[data-theme="dark"]{--bg:#12042e;--bg-alt:#0b0220;--card:#1a0b40;--ink:#ffffff;--ink-2:#d8ccf2;--ink-3:#b6a8dc;--line:#3a2a6a;--line-soft:#2a1a58;--brand:#a5ffd6;--brand-ink:#a5ffd6;--brand-ink-h:#c9ffe6;--brand-wash:rgba(165,255,214,.12);--shadow:none;--shadow-lg:none;--maxw:1120px;--body:'Space Grotesk',system-ui,sans-serif;--sys:var(--body);--oil:linear-gradient(90deg,#a5ffd6 0%,#7fe3ff 50%,#cdb8ff 100%);--deep:#12042e;--mint:#a5ffd6}
html[lang="ru"],html[lang="uk"]{--body:'Manrope',system-ui,sans-serif}
html{background:#12042e}
body{background:#12042e;color:#fff;font-family:var(--body)}
h1,h2,h3,h4,.h-mega,.h-sec,.btn,.strip .n,.st-row .v,.big-num,.member h4,.post h4,.tile h3,.check h4,details.qa summary,.brand .name,.member .av,.article h1.title,.art-cta h3{font-family:'Unbounded',sans-serif;font-weight:700;letter-spacing:-.01em}
.h-mega{font-weight:800;font-size:clamp(38px,5.3vw,72px);line-height:1;letter-spacing:-.02em}
.h-sec{font-weight:800;font-size:clamp(28px,4vw,46px);line-height:1.08;letter-spacing:-.02em}
.eyebrow{font-family:'Unbounded',sans-serif;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#a5ffd6}
.sub{color:#d8ccf2}
.btn{border-radius:16px;font-size:15px;padding:13px 22px;font-weight:800;border:0}
.btn-primary{background:#a5ffd6;color:#12042e}.btn-primary:hover{background:#c9ffe6}
.btn-secondary{border:2px solid #a5ffd6;color:#a5ffd6;background:transparent}.btn-secondary:hover{background:#a5ffd6;color:#12042e;border-color:#a5ffd6}
.link-chev{color:#a5ffd6;font-family:'Unbounded',sans-serif;font-weight:700;font-size:15px}.link-chev:hover{color:#c9ffe6}

/* header rides on the oil mass */
header{background:var(--oil);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0;height:60px}
.nav{height:60px}
.brand .name{color:#12042e;font-size:17px;font-weight:800}
.nav-links a{color:#12042e;font-weight:700;opacity:.82}.nav-links a:hover{opacity:1;color:#12042e}
.nav-right .btn{background:#12042e;color:#a5ffd6;padding:9px 16px;font-size:13px;border-radius:12px}.nav-right .btn:hover{background:#1e0c4a}
.langsw{background-color:transparent!important;border:2px solid #12042e!important;color:#12042e!important;font-family:var(--body)!important;font-weight:700!important;box-shadow:none!important}
.langsw:hover{background-color:rgba(18,4,46,.08)!important}.langsw option{color:#0f172a;background:#fff}
.mnav-toggle{background:#12042e;border:0;color:#a5ffd6;border-radius:12px}

/* every hero: dark ink on the oil gradient, melted bottom edge */
.hero{position:relative;background:var(--oil);color:#12042e;overflow:visible}
.hero .eyebrow{color:#12042e}
.hero h1,.hero .h-mega,.hero .h-sec,.article h1.title{color:#12042e}
.hero .sub{color:#12042e;opacity:.85}
.hero .btn-primary{background:#12042e;color:#a5ffd6}.hero .btn-primary:hover{background:#1e0c4a}
.hero .btn-secondary{border-color:#12042e;color:#12042e}.hero .btn-secondary:hover{background:#12042e;color:#a5ffd6}
.hero .link-chev{color:#12042e}
.hero .breadcrumb,.hero .breadcrumb a,.hero .cat,.hero .meta{color:#12042e}.hero .breadcrumb,.hero .meta{opacity:.72}.hero .cat{font-family:'Unbounded',sans-serif;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.hero .wrap{position:relative;z-index:2}
.oil-drips{position:absolute;left:0;top:100%;width:100%;height:220px;z-index:1;pointer-events:none;display:block;overflow:visible}
.oil-drips.mob{display:none;height:170px}
.oil-drips.sm{height:150px}.oil-drips.sm.mob{height:120px}

/* homepage hero: two columns, card on the right */
.oil-home{text-align:left;padding:56px 0 120px}
.oil-home .wrap{display:grid;grid-template-columns:minmax(0,1fr) 380px;column-gap:56px;align-items:center}
.oil-home .eyebrow,.oil-home h1,.oil-home .sub,.oil-home .hero-actions{grid-column:1}
.oil-home .eyebrow{margin-bottom:18px}
.oil-home h1{max-width:none;margin:0}
.oil-home .sub{margin:22px 0 0;max-width:600px}
.oil-home .hero-actions{justify-content:flex-start;margin-top:28px}
.oil-home .hero-visual{grid-column:2;grid-row:1/span 4;margin:0;max-width:none;width:100%}
.glow{display:none}
.statement{background:#1a0b40;border:1px solid #2a1a58;border-radius:22px;box-shadow:none!important;color:#fff}
.hero .statement{background:#12042e;border:2px solid #7fe3ff;padding:24px 24px}
.statement .st-top{border-bottom:1px solid rgba(255,255,255,.14)}
.st-top .who{gap:10px}.st-top .who b{color:#fff;font-family:'Unbounded',sans-serif;font-weight:700}.st-top .who span{color:#b6a8dc;font-size:12.5px}
.st-row{border-bottom:1px solid rgba(255,255,255,.14)}.st-row .k{color:#d8ccf2}.st-row .v{color:#a5ffd6}.st-row .v.big{color:#a5ffd6}
.badge{background:#a5ffd6;color:#12042e;font-weight:700;white-space:nowrap;font-size:12px;padding:6px 11px}
.dot{background:#3a2a6a}.dot:hover{background:#7fe3ff}.dot.active{background:#a5ffd6}

/* subpage heroes: centred title band */
body.oil-sub .hero{padding-top:64px!important;padding-bottom:70px!important}
body.oil-sub .hero+section{padding-top:150px!important}
body.oil-sub .h-mega{font-size:clamp(34px,4.6vw,60px)}

/* stat strip: solid cards sitting among the drips, melting at the bottom */
.hero+.wrap{position:relative;z-index:3}
.strip{border:0;gap:18px;margin-top:70px}
.strip .cell{background:#24145a;border:0!important;border-radius:20px;padding:30px 12px 28px;position:relative}
.strip .cell::after{content:"";position:absolute;left:0;right:0;bottom:-31px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 318 34' preserveAspectRatio='none'%3E%3Cpath fill='%2324145a' d='M44,0h26v16a13,13 0 0 1 -26,0z M158,0h22v24a11,11 0 0 1 -22,0z M250,0h18v10a9,9 0 0 1 -18,0z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.strip .n{color:#fff;font-weight:800;font-size:clamp(28px,3vw,40px);white-space:nowrap}.strip .l{color:#b6a8dc;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-top:8px}

/* sections */
section.band{background:#0b0220}
#partners{position:relative;overflow:hidden;padding-top:150px}
#partners>.wrap{position:relative;z-index:1}
#partners .center.reveal[style]{margin:26px auto 12px!important}
.oil-edge{position:absolute;left:0;top:0;width:100%;height:170px;pointer-events:none;z-index:0}
.chip{background:transparent;border:2px solid #a5ffd6;color:#a5ffd6;font-weight:700;white-space:nowrap}
.center>.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.tile{background:#1a0b40;border:1px solid #2a1a58;box-shadow:none}
.tile h3{color:#a5ffd6;font-size:19px}.tile p{color:#d8ccf2}
.tile .ic{background:rgba(165,255,214,.12);color:#a5ffd6}
.tile .chip{border-color:#3a2a6a;color:#d8ccf2}
.tile.wide .big-num{color:#fff}
.check{border-top:1px solid #2a1a58}.check .tk{background:#a5ffd6}.check .tk svg *{stroke:#12042e!important}
.check h4{color:#fff}.check p{color:#d8ccf2}
.member{background:#1a0b40;border:1px solid #2a1a58;box-shadow:none}
.member .av{background:rgba(165,255,214,.12);color:#a5ffd6}.member .role{color:#b6a8dc}.member .tg{color:#a5ffd6}
.post{background:#1a0b40;border:1px solid #2a1a58;box-shadow:none}.post .m{color:#a5ffd6}.post h4{color:#fff}.post p{color:#d8ccf2}
.qa{border-top:1px solid #2a1a58}.qa h3{color:#fff}details.qa summary{color:#fff;font-size:18px}details.qa summary:hover{color:#a5ffd6}
details.qa summary::after{border-color:#b6a8dc}details.qa p,.qa p{color:#d8ccf2}
.closing{position:relative;overflow:hidden;background:#0b0220}
.closing .wrap{position:relative;z-index:1}
.oil-blobs{position:absolute;right:-80px;bottom:-70px;width:560px;height:460px;z-index:0;pointer-events:none}

/* blog article */
article.article{max-width:none}
.prose p,.prose h2,.prose h3{color:#fff}.prose li{color:#d8ccf2}.prose li::before{background:#a5ffd6}
.prose a{color:#a5ffd6}
.art-cta{background:#1a0b40;border-color:#2a1a58}.art-cta h3{color:#fff}.art-cta p{color:#d8ccf2}

/* footer + chrome */
footer{background:#08011a;border-top:1px solid #2a1a58}
footer .brand .name{color:#fff}.foot-brand p,.fcol a,.foot-bottom{color:#b6a8dc}.fcol a:hover{color:#fff}.fcol h5{color:#a5ffd6}.foot-bottom{border-top-color:#2a1a58}
footer a[href^="https://ocom.uno"] span{color:#b6a8dc!important}footer a[href^="https://ocom.uno"] b{color:#fff!important}
.cc{background:#1a0b40;border-color:#3a2a6a}.cc p{color:#d8ccf2}.cc p a{color:#a5ffd6}.cc .accept{background:#a5ffd6;color:#12042e}.cc .decline{border-color:#3a2a6a;color:#fff}.cc .decline:hover{background:#24145a}
.mnav-panel{background:#12042e;border-left:1px solid #2a1a58}
.mnav-links a{color:#fff;border-bottom-color:#2a1a58;font-family:'Unbounded',sans-serif;font-weight:700;font-size:16px}
.mnav-close{color:#fff}.mnav-lang .langsw{color:#fff!important;border-color:#3a2a6a!important}.mnav-lang .langsw option{color:#0f172a}
.mnav-cta{background:#a5ffd6;color:#12042e}
html,body{max-width:100%;overflow-x:hidden}

@media(max-width:900px){
  .oil-home .wrap{display:block;text-align:center}
  .oil-home{text-align:center;padding:44px 0 100px}
  .oil-home .sub{margin-left:auto;margin-right:auto}
  .oil-home .hero-actions{justify-content:center}
  .oil-home .hero-visual{margin:40px auto 0;max-width:440px}
  .oil-blobs{width:380px;height:312px;right:-60px;bottom:-50px}
}
@media(max-width:720px){.strip{grid-template-columns:repeat(2,1fr);row-gap:48px}.strip .cell:nth-child(n+3){border-top:0!important}}
@media(max-width:700px){.oil-drips.desk{display:none}.oil-drips.mob{display:block}}
@media(max-width:560px){
  .oil-home{padding:30px 0 84px}.h-mega{font-size:clamp(34px,10vw,44px)}.strip{margin-top:50px}
  body.oil-sub .hero{padding-top:40px!important;padding-bottom:56px!important}
  body.oil-sub .hero+section{padding-top:120px!important}
  #partners{padding-top:120px}.nav-right .btn{padding:8px 13px;font-size:12.5px;border-radius:10px}
}