*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#07080a;color:#f4f5f7;font-family:Inter,Arial,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}::selection{background:#fff;color:#07080a}:root{--line:#252a33;--muted:#9aa3b2;--accent:#5ee7ff;--accent-2:#7c6cff;--surface:#0e1116;--surface-2:#131720}
.header{height:76px;padding:0 clamp(18px,5vw,78px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1b1e23;background:#07080add;backdrop-filter:blur(20px);position:sticky;top:0;z-index:20}.logo{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:800;letter-spacing:-.7px}.logo>span:last-child>span{color:#858c96}.mark{width:34px;height:34px;border:1px solid #3a4049;border-radius:9px;display:grid;place-items:center;background:#111318}.header nav{display:flex;gap:28px;color:#9199a4;font-size:11px}.header nav a:hover{color:#fff}.head-btn{border:1px solid #363b44;border-radius:99px;padding:9px 15px;font-size:10px;font-weight:800}.menu{display:none;background:none;border:0;color:#fff;font-size:20px}
.hero{max-width:1280px;min-height:710px;margin:auto;padding:90px clamp(18px,5vw,78px);display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}.eyebrow,label{font-size:9px;letter-spacing:2px;font-weight:800;color:#737b86}.eyebrow{display:flex;gap:10px;align-items:center}.eyebrow span{width:27px;height:1px;background:#737b86}.hero h1{font-size:clamp(55px,7.5vw,98px);line-height:.9;letter-spacing:-6px;margin:22px 0 28px}.hero h1 em,.section h2 em,.media h2 em,.brand-layout h2 em,.contact h2 em{font-style:normal;color:#858d98}.hero p{max-width:590px;color:#9ca4ae;font-size:17px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:32px 0 43px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 19px;border-radius:99px;font-size:10px;font-weight:800;transition:.2s}.white{background:#fff;color:#08090c}.white:hover{transform:translateY(-2px)}.outline{border:1px solid #363b44;color:#d7dbe0}.metrics{display:flex;gap:36px}.metrics div{display:flex;flex-direction:column}.metrics b{font-size:18px}.metrics small{font-size:9px;color:#747c87}.hero-art{height:500px;display:grid;place-items:center;position:relative}.ring{position:absolute;border:1px solid #1d2127;border-radius:50%;width:500px;height:500px}.r2{width:640px;height:280px;transform:rotate(-27deg)}.hero-card{width:min(435px,84%);height:365px;border:1px solid #373c45;border-radius:22px;background:linear-gradient(140deg,#191c22,#090a0d 70%);box-shadow:0 45px 100px #000;transform:rotate(3deg);overflow:hidden;position:relative;z-index:2}.card-top{height:49px;border-bottom:1px solid #282c33;padding:16px 19px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:1.5px;color:#757d88}.card-body{height:calc(100% - 49px);padding:24px;display:flex;flex-direction:column;justify-content:space-between}.card-body small{font-size:8px;letter-spacing:2px;color:#9ca3ad}.card-body strong{font-size:76px;line-height:.78;letter-spacing:-5px}.card-body i{align-self:center;width:58px;height:58px;background:#fff;color:#08090c;border-radius:50%;display:grid;place-items:center;font-style:normal}.card-body>span{font-size:7px;letter-spacing:1.3px;color:#737b86}
.focus{border-top:1px solid #1c2025;border-bottom:1px solid #1c2025;background:#090b0e}.focus-section{padding-top:92px;padding-bottom:92px}.focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.focus-grid article{min-height:175px;border:1px solid #252a31;border-radius:16px;padding:22px;background:#0b0d10;transition:transform .2s,border-color .2s}.focus-grid article:hover{transform:translateY(-3px);border-color:#414751}.focus-grid span{font-size:8px;color:#666e79}.focus-grid h3{font-size:18px;margin:30px 0 7px;letter-spacing:-.4px}.focus-grid p{font-size:10px;color:#737b86;margin:0;max-width:290px}.availability{background:#f1f2f3;color:#090b0e}.availability-inner{display:flex;justify-content:space-between;align-items:center;gap:30px;padding-top:65px;padding-bottom:65px}.availability h2{margin-top:13px}.availability .white{background:#090b0e;color:#fff}.menu{cursor:pointer}.header nav.open{display:flex;position:absolute;top:76px;left:18px;right:18px;flex-direction:column;gap:0;padding:8px;border:1px solid #292e36;border-radius:14px;background:#0d0f13;box-shadow:0 20px 60px #000}.header nav.open a{padding:14px 12px;border-bottom:1px solid #20242a}.header nav.open a:last-child{border-bottom:0}
.section{max-width:1280px;margin:auto;padding:100px clamp(18px,5vw,78px)}.head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:37px}.section h2,.media h2,.brand-layout h2,.contact h2{font-size:clamp(37px,4.7vw,63px);line-height:.96;letter-spacing:-3px;margin:13px 0 0}.text-link{font-size:10px;color:#a7adb5;border-bottom:1px solid #555b63;padding-bottom:3px}.video-box{display:grid;grid-template-columns:1.35fr .65fr;gap:16px}.video-screen{height:420px;border:1px solid #252a31;border-radius:17px;background:radial-gradient(circle at 68% 28%,#4e555f,#171a20 52%,#090a0c);position:relative;display:flex;flex-direction:column;justify-content:center;padding:30px;overflow:hidden}.video-screen:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0009,transparent 65%)}.screen-label{position:absolute;z-index:2;top:18px;left:18px;font-size:8px;letter-spacing:1.6px;border:1px solid #555b64;padding:7px;border-radius:6px}.screen-word{z-index:2;font-size:75px;line-height:.78;font-weight:800;letter-spacing:-5px}.screen-word span{font-size:10px;letter-spacing:2px;color:#bbc0c7}.screen-play{z-index:3;align-self:center;margin-top:30px;width:55px;height:55px;border-radius:50%;background:#fff;color:#08090c;display:grid;place-items:center}.video-copy{border:1px solid #252a31;border-radius:17px;background:#0f1115;padding:27px;display:flex;flex-direction:column;justify-content:center}.video-copy small{font-size:8px;letter-spacing:1.5px;color:#747c87}.video-copy h3{font-size:27px;line-height:1.08;letter-spacing:-1px;margin:17px 0}.video-copy p{font-size:11px;color:#777f8a;max-width:360px}.dark{background:#0c0e11;border-top:1px solid #1c2026;border-bottom:1px solid #1c2026}.intro{max-width:430px;color:#818995;font-size:12px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.grid4 article{min-height:230px;border:1px solid #252a31;border-radius:16px;padding:20px;background:#0a0c0f;display:flex;flex-direction:column}.grid4 article>span{font-size:8px;color:#666e79}.grid4 i{font-style:normal;font-size:25px;color:#b6bcc4;margin-top:28px}.grid4 h3{font-size:17px;margin:13px 0 5px}.grid4 p{font-size:10px;color:#737b86;margin:0}
.media{background:#f1f2f3;color:#090b0e;padding:100px clamp(18px,5vw,78px)}.media-inner{max-width:1135px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.media p{max-width:560px;color:#5e656e;font-size:13px;margin:22px 0 27px}.black{background:#08090c;color:#fff}.numbers{display:grid;grid-template-columns:1fr 1fr;border-left:1px solid #cfd1d4}.numbers div{padding:25px 28px;border-bottom:1px solid #cfd1d4}.numbers div:nth-child(odd){border-right:1px solid #cfd1d4}.numbers b{display:block;font-size:39px;letter-spacing:-2px}.numbers span{font-size:9px;color:#70777f}
.brands{background:#080a0d}.brand-layout{display:grid;grid-template-columns:1fr .82fr;gap:80px;align-items:center}.brand-layout p{max-width:560px;color:#858d97;font-size:13px;margin-top:23px}.offer{border:1px solid #282d34;border-radius:19px;background:#101217;padding:9px}.offer>div{display:grid;grid-template-columns:30px 1fr 18px;padding:18px 12px;border-bottom:1px solid #242830;align-items:center}.offer b{font-size:8px;color:#69717c}.offer span{font-size:11px}.offer i{font-style:normal;color:#737b85}.full{width:100%;margin-top:10px}.brand-note{margin-top:55px;border-top:1px solid #22272e;border-bottom:1px solid #22272e;padding:17px 0;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:8px;letter-spacing:1.2px;color:#6f7782}
.contact{text-align:center;border-top:1px solid #1c2025;padding:105px 18px}.contact p{font-size:12px;color:#7d8590}.contact>a{display:inline-block;font-size:clamp(22px,4vw,40px);font-weight:700;letter-spacing:-1.5px;border-bottom:1px solid #50565f;margin-top:12px}.contact h2{margin-top:13px}footer{padding:28px clamp(18px,5vw,78px);border-top:1px solid #1c2025;display:flex;justify-content:space-between;align-items:center;color:#666e78;font-size:9px}.progress{position:fixed;top:0;left:0;width:0;height:2px;background:#fff;z-index:100}
@media(max-width:900px){.header nav{display:none}.menu{display:block}.head-btn{margin-left:auto;margin-right:15px}.hero{grid-template-columns:1fr;padding-top:65px}.hero-art{height:390px}.video-box,.media-inner,.brand-layout{grid-template-columns:1fr}.video-screen{height:360px}.grid4{grid-template-columns:1fr 1fr}.focus-grid{grid-template-columns:1fr 1fr}.availability-inner{flex-direction:column;align-items:flex-start}.head{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.hero{padding-top:55px}.hero h1{letter-spacing:-3.5px}.metrics{gap:20px;flex-wrap:wrap}.hero-art{height:310px}.hero-card{height:270px}.card-body strong{font-size:58px}.ring{width:330px;height:330px}.r2{width:400px;height:210px}.video-screen{height:255px}.screen-word{font-size:54px}.grid4{grid-template-columns:1fr}.focus-grid{grid-template-columns:1fr}.numbers b{font-size:30px}footer{flex-direction:column;align-items:flex-start;gap:14px}}


/* AnasseTech V7 — refined premium palette */
body{
  background:#07090d;
  color:#f7f9fc;
}
.header{
  background:rgba(7,9,13,.88);
  border-bottom-color:#1b212b;
}
.logo>span:last-child>span{color:#8f99aa}
.mark{
  border-color:#343d4a;
  background:linear-gradient(145deg,#151a22,#0c0f14);
}
.eyebrow span{background:var(--accent)}
.eyebrow,label{color:#8994a6}
.hero h1 em,.section h2 em,.media h2 em,.brand-layout h2 em,.contact h2 em{
  color:#8793a6;
}
.btn.outline{
  border-color:#36404d;
}
.btn.outline:hover{
  border-color:var(--accent);
  color:#fff;
}
.progress{background:linear-gradient(90deg,var(--accent),var(--accent-2))}
.focus-grid article:hover,.grid4 article:hover{
  border-color:#3c4858;
  box-shadow:0 12px 40px rgba(0,0,0,.18);
}
.focus-grid article,.grid4 article{
  background:linear-gradient(145deg,#0d1117,#0a0d12);
}
.video-screen{
  background:radial-gradient(circle at 68% 28%,#344454,#171c24 52%,#090b0f);
}
.video-copy,.offer{
  background:linear-gradient(145deg,#11151c,#0d1015);
}
.dark{
  background:#0a0d12;
}
.media,.availability{
  background:#eef2f5;
}
.availability .white{background:#0a0d12}
.brands{background:#080b10}
.contact>a:hover{color:var(--accent);border-color:var(--accent)}

/* Collaboration logos */
.collab-logos{
  margin-top:78px;
  padding-top:34px;
  border-top:1px solid #222933;
}
.collab-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:35px;
  margin-bottom:24px;
}
.collab-heading h3{
  margin:10px 0 0;
  font-size:clamp(24px,3vw,36px);
  line-height:1;
  letter-spacing:-1.5px;
}
.collab-heading p{
  max-width:360px;
  margin:0;
  color:#7f8999;
  font-size:11px;
}
.logo-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.brand-logo{
  min-height:82px;
  border:1px solid #252d38;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  color:#e7ebf1;
  background:linear-gradient(145deg,#11151c,#0c1015);
  font-size:17px;
  font-weight:800;
  letter-spacing:-.6px;
  filter:grayscale(1);
  transition:transform .2s ease,border-color .2s ease,color .2s ease,background .2s ease;
}
.brand-logo:nth-child(2n){font-weight:700}
.brand-logo:nth-child(3n){letter-spacing:0}
.brand-logo:hover{
  transform:translateY(-3px);
  border-color:#526071;
  color:#fff;
  background:linear-gradient(145deg,#151b23,#0d1117);
}
@media(max-width:900px){
  .logo-grid{grid-template-columns:repeat(3,1fr)}
  .collab-heading{align-items:flex-start;flex-direction:column}
}
@media(max-width:560px){
  .logo-grid{grid-template-columns:repeat(2,1fr)}
  .brand-logo{min-height:72px;font-size:15px}
  .collab-logos{margin-top:55px}
}

/* =========================================================
   AnasseTech V8 — Light Tech / Premium Color Refresh
   ========================================================= */
:root{
  --bg:#f6f8fc;
  --paper:#ffffff;
  --paper-2:#eef3fa;
  --ink:#111827;
  --muted:#657085;
  --line:#dfe5ee;
  --accent:#1677ff;
  --accent-2:#7b61ff;
  --cyan:#08b9c9;
  --soft-blue:#eaf3ff;
  --soft-purple:#f0edff;
}
html{background:var(--bg)}
body{
  background:
    radial-gradient(circle at 88% 8%,rgba(123,97,255,.08),transparent 24%),
    radial-gradient(circle at 5% 18%,rgba(8,185,201,.06),transparent 22%),
    var(--bg);
  color:var(--ink);
}
::selection{background:#cfe2ff;color:#0b1a33}
.header{
  background:rgba(246,248,252,.86);
  border-bottom:1px solid rgba(210,218,230,.8);
  box-shadow:0 8px 30px rgba(33,55,90,.04);
}
.logo>span:last-child>span{color:#64748b}
.mark{
  border:1px solid #cfd8e6;
  background:linear-gradient(145deg,#fff,#edf3fb);
  color:#172033;
  box-shadow:0 5px 18px rgba(34,71,120,.08);
}
.header nav{color:#68758a}
.header nav a:hover{color:var(--accent)}
.head-btn{
  border-color:#cdd7e5;
  color:#1f2937;
  background:#fff;
}
.menu{color:#172033}
.eyebrow,label{color:#64748b}
.eyebrow span{background:linear-gradient(90deg,var(--accent),var(--cyan))}
.hero{position:relative}
.hero:before{
  content:"";
  position:absolute;
  width:430px;height:430px;
  border-radius:50%;
  background:linear-gradient(135deg,rgba(22,119,255,.12),rgba(123,97,255,.08));
  filter:blur(2px);
  right:2%;top:9%;
  pointer-events:none;
}
.hero h1{
  color:#101828;
  text-shadow:0 2px 30px rgba(22,119,255,.04);
}
.hero h1 em,.section h2 em,.media h2 em,.brand-layout h2 em,.contact h2 em{
  color:transparent;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  -webkit-background-clip:text;background-clip:text;
}
.hero p{color:#59667b}
.btn.white{
  background:linear-gradient(135deg,#1677ff,#5b6dff);
  color:#fff;
  box-shadow:0 10px 24px rgba(22,119,255,.20);
}
.btn.white:hover{box-shadow:0 14px 30px rgba(22,119,255,.27)}
.btn.outline{border-color:#cbd6e5;color:#263247;background:rgba(255,255,255,.7)}
.btn.outline:hover{border-color:var(--accent);color:var(--accent);background:#fff}
.metrics b{color:#152033}
.metrics small{color:#718096}
.hero-art{z-index:1}
.ring{border-color:rgba(22,119,255,.12)}
.r2{border-color:rgba(123,97,255,.12)}
.hero-card{
  border:1px solid #d4deeb;
  background:linear-gradient(145deg,#ffffff,#eaf1fb 70%);
  box-shadow:0 35px 80px rgba(34,67,110,.16);
}
.card-top{border-bottom-color:#e1e7ef;color:#66758a}
.card-body small,.card-body>span{color:#66758a}
.card-body strong{
  color:#172033;
  background:linear-gradient(135deg,#1677ff,#7b61ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.card-body i{
  background:linear-gradient(135deg,#1677ff,#7b61ff);
  color:#fff;
  box-shadow:0 8px 20px rgba(22,119,255,.25);
}
.focus{border-color:#e1e7ef;background:#fff}
.focus-grid article{
  border-color:#dfe6ef;
  background:linear-gradient(145deg,#fff,#f7faff);
  box-shadow:0 8px 30px rgba(31,55,90,.04);
}
.focus-grid article:hover,.grid4 article:hover{
  border-color:#a9c7f4;
  box-shadow:0 14px 35px rgba(31,73,130,.10);
}
.focus-grid span,.grid4 article>span{color:#7c8aa0}
.focus-grid h3,.grid4 h3{color:#162033}
.focus-grid p,.grid4 p{color:#66748a}
.section h2,.media h2,.brand-layout h2,.contact h2{color:#111827}
.text-link{color:#516078;border-color:#b8c4d5}
.video-box{position:relative}
.video-screen{
  border-color:#d8e1ed;
  background:
    radial-gradient(circle at 68% 25%,rgba(8,185,201,.55),transparent 25%),
    linear-gradient(135deg,#dcecff,#eef1ff 48%,#f8fbff);
  box-shadow:0 15px 45px rgba(31,66,115,.08);
}
.video-screen:after{background:linear-gradient(0deg,rgba(25,43,72,.18),transparent 65%)}
.screen-label{
  color:#41506a;
  border-color:#b8c8dd;
  background:rgba(255,255,255,.58);
}
.screen-word{color:#14213a}
.screen-word span{color:#4e617c}
.screen-play{
  background:linear-gradient(135deg,#1677ff,#7b61ff);
  color:#fff;
  box-shadow:0 12px 28px rgba(22,119,255,.25);
}
.video-copy{
  border-color:#dce4ee;
  background:#fff;
  box-shadow:0 10px 35px rgba(31,55,90,.05);
}
.video-copy small{color:#66758b}
.video-copy h3{color:#172033}
.video-copy p{color:#66748a}
.dark{
  background:linear-gradient(180deg,#eef4fb,#f7f9fc);
  border-color:#dce4ee;
}
.grid4 article{
  border-color:#dce4ee;
  background:#fff;
  box-shadow:0 8px 30px rgba(31,55,90,.04);
}
.grid4 i{color:var(--accent)}
.media,.availability{
  background:linear-gradient(135deg,#eaf3ff,#f5f1ff);
  color:#101828;
}
.media p{color:#59667a}
.black{background:#111827;color:#fff;box-shadow:0 10px 25px rgba(17,24,39,.16)}
.numbers{border-left-color:#d3dce9}
.numbers div{border-bottom-color:#d3dce9}
.numbers div:nth-child(odd){border-right-color:#d3dce9}
.numbers b{color:#162033}
.numbers span{color:#68758a}
.brands{background:#fff}
.brand-layout p{color:#647188}
.offer{
  border-color:#dce4ee;
  background:linear-gradient(145deg,#fff,#f6f9fd);
  box-shadow:0 12px 35px rgba(31,55,90,.06);
}
.offer>div{border-bottom-color:#e4e9f0}
.offer b{color:#6f7e93}
.offer span{color:#1c2940}
.brand-note{border-color:#dce4ee;color:#718096}
.collab-logos{border-top-color:#dce4ee}
.collab-heading p{color:#66758b}
.brand-logo{
  border-color:#dce4ee;
  color:#1e2a3f;
  background:linear-gradient(145deg,#fff,#f4f7fb);
  box-shadow:0 7px 22px rgba(31,55,90,.04);
}
.brand-logo:hover{
  border-color:#9ebff0;
  color:#0f5fca;
  background:linear-gradient(145deg,#fff,#eef6ff);
  box-shadow:0 10px 25px rgba(22,119,255,.10);
}
.contact{border-top-color:#dce4ee}
.contact p{color:#68758a}
.contact>a{border-color:#b9c5d6}
.contact>a:hover{color:var(--accent);border-color:var(--accent)}
footer{
  border-top-color:#dce4ee;
  color:#718096;
  background:#fff;
}
.header nav.open{
  background:#fff;
  border-color:#dce4ee;
  box-shadow:0 20px 60px rgba(31,55,90,.14);
}
.header nav.open a{border-bottom-color:#e7ebf1}

/* Journal / articles */
.journal{
  background:linear-gradient(180deg,#f7f9fc 0%,#eef4fb 100%);
  border-top:1px solid #e0e7f0;
  border-bottom:1px solid #e0e7f0;
}
.static-link{border-bottom:0}
.article-grid{
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr;
  gap:14px;
}
.article-card{
  min-height:330px;
  border:1px solid #dce4ee;
  border-radius:20px;
  background:#fff;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
  box-shadow:0 8px 30px rgba(31,55,90,.05);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.article-card:before{
  content:"";
  position:absolute;
  width:150px;height:150px;border-radius:50%;
  right:-55px;top:-55px;
  background:rgba(22,119,255,.10);
}
.article-card:nth-child(2):before{background:rgba(8,185,201,.10)}
.article-card:nth-child(3):before{background:rgba(123,97,255,.10)}
.article-card:hover{
  transform:translateY(-4px);
  border-color:#b7cbed;
  box-shadow:0 18px 42px rgba(31,55,90,.10);
}
.article-card.featured{
  background:linear-gradient(145deg,#ffffff,#f0f6ff);
}
.article-tag{
  width:max-content;
  border-radius:99px;
  padding:6px 9px;
  font-size:8px;
  font-weight:800;
  letter-spacing:1.2px;
  color:#0f64d2;
  background:#e8f2ff;
  position:relative;z-index:1;
}
.article-tag.cyan{color:#078694;background:#e5fbfd}
.article-tag.purple{color:#684be0;background:#f0edff}
.article-icon{
  font-size:42px;
  line-height:1;
  color:var(--accent);
  position:relative;z-index:1;
  margin-top:24px;
}
.article-card:nth-child(2) .article-icon{color:var(--cyan)}
.article-card:nth-child(3) .article-icon{color:var(--accent-2)}
.article-content{position:relative;z-index:1}
.article-content small{font-size:8px;letter-spacing:1.5px;color:#78869b}
.article-content h3{
  font-size:22px;
  line-height:1.08;
  letter-spacing:-.8px;
  color:#172033;
  margin:9px 0;
}
.article-content p{font-size:11px;color:#68758a;margin:0 0 17px}
.article-link{
  font-size:10px;
  font-weight:800;
  color:#176dd6;
}
.article-link:hover{color:#694de2}

@media(max-width:900px){
  .article-grid{grid-template-columns:1fr 1fr}
  .article-card.featured{grid-column:1/-1}
}
@media(max-width:560px){
  .article-grid{grid-template-columns:1fr}
  .article-card.featured{grid-column:auto}
  .article-card{min-height:290px}
}


/* =========================================================
   AnasseTech V8.1 — Brighter / More Colorful Premium Finish
   ========================================================= */
:root{
  --accent:#146BFF;
  --accent-2:#7A4DFF;
  --cyan:#00B8D9;
  --ink:#0F172A;
  --muted:#64748B;
  --bg:#F7F9FD;
}
body{
  background:
    radial-gradient(700px 420px at 88% 2%, rgba(122,77,255,.10), transparent 65%),
    radial-gradient(620px 420px at 3% 16%, rgba(0,184,217,.09), transparent 62%),
    linear-gradient(180deg,#fbfcff 0%,#f4f7fc 100%);
}
.header{background:rgba(251,252,255,.78);backdrop-filter:blur(22px);}
.logo{color:#101828}.logo>span:last-child>span{color:#5b6b82}
.mark{border-color:#cbd7e8;background:linear-gradient(145deg,#fff,#edf4ff);color:#1258d6;box-shadow:0 8px 24px rgba(20,107,255,.10)}
.header nav{color:#5f6e83}.header nav a:hover{color:#146BFF}
.head-btn{border-color:#c7d5e8;background:linear-gradient(180deg,#fff,#f7faff);color:#1d2a40;box-shadow:0 6px 20px rgba(28,63,110,.06)}
.live-badge{font-size:7px;letter-spacing:1px;font-weight:800;color:#146BFF;background:#eaf2ff;border:1px solid #cfe0ff;padding:5px 7px;border-radius:999px;margin-left:2px}
.hero:before{width:520px;height:520px;right:-2%;top:5%;background:radial-gradient(circle,rgba(20,107,255,.12),rgba(122,77,255,.06) 48%,transparent 70%)}
.hero h1{font-weight:800}.hero h1 em{background:linear-gradient(90deg,#146BFF 0%,#00A9D6 46%,#7A4DFF 100%);-webkit-background-clip:text;background-clip:text}
.hero p{color:#56667d}.actions{margin-bottom:40px}
.btn.white{background:linear-gradient(135deg,#146BFF 0%,#5d6dff 58%,#7A4DFF 100%);box-shadow:0 12px 28px rgba(20,107,255,.22)}
.btn.outline{border-color:#c7d6e9;color:#26364e}.btn.outline:hover{color:#146BFF;background:#fff;border-color:#8bb6ff}
.metrics b{color:#0f1c33}.metrics small{color:#718198}
.hero-card{background:linear-gradient(145deg,#fff 0%,#eef6ff 55%,#f5f0ff 100%);border-color:#cbd9ea;box-shadow:0 38px 90px rgba(31,74,135,.16)}
.card-body strong{background:linear-gradient(135deg,#146BFF,#7A4DFF);-webkit-background-clip:text;background-clip:text}
.card-body i{background:linear-gradient(135deg,#146BFF,#7A4DFF)}
.ring{border-color:rgba(20,107,255,.16)}.r2{border-color:rgba(122,77,255,.14)}
.focus{background:rgba(255,255,255,.72);backdrop-filter:blur(10px)}
.focus-grid article,.grid4 article{background:linear-gradient(145deg,#fff,#f8fbff);border-color:#d9e4f1}
.focus-grid article:nth-child(2) .focus-icon,.focus-grid article:nth-child(4) .focus-icon{color:var(--cyan)}
.focus-grid article:hover,.grid4 article:hover{border-color:#9fc3ff;box-shadow:0 18px 42px rgba(28,78,145,.10)}
.section h2 em,.media h2 em,.brand-layout h2 em,.contact h2 em{background:linear-gradient(90deg,#146BFF,#7A4DFF);-webkit-background-clip:text;background-clip:text}
.video-screen{background:radial-gradient(circle at 74% 20%,rgba(0,184,217,.65),transparent 25%),radial-gradient(circle at 24% 80%,rgba(122,77,255,.28),transparent 30%),linear-gradient(135deg,#dcecff,#f0efff 52%,#f8fcff)}
.video-copy{background:linear-gradient(145deg,#fff,#f7faff);border-color:#d9e4f1}
.screen-play{background:linear-gradient(135deg,#146BFF,#7A4DFF)}
.dark{background:linear-gradient(180deg,#f1f6fd,#fbfcff)}
.media,.availability{background:linear-gradient(135deg,#e9f4ff 0%,#f2efff 52%,#edfbfd 100%)}
.black{background:linear-gradient(135deg,#101827,#202c43)}
.brands{background:linear-gradient(180deg,#fff,#f8fbff)}
.offer{background:linear-gradient(145deg,#fff,#f5f9ff);border-color:#d7e3f0}
.offer>div{border-bottom-color:#e5ebf3}.brand-note{border-color:#d9e4ef}
.brand-logo{background:linear-gradient(145deg,#fff,#f5f9ff);border-color:#d7e3f0;position:relative;overflow:hidden}
.brand-logo:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 25%,rgba(20,107,255,.055),transparent 75%);transform:translateX(-100%);transition:transform .45s ease}
.brand-logo:hover:before{transform:translateX(100%)}
.brand-logo:hover{border-color:#91b9f4;color:#146BFF;box-shadow:0 14px 32px rgba(20,107,255,.10)}
.journal{background:linear-gradient(180deg,#f4f8fd 0%,#edf4ff 100%)}
.article-card{border-color:#d8e3f0;box-shadow:0 10px 32px rgba(31,68,120,.055)}
.article-card.featured{background:linear-gradient(145deg,#fff,#eef6ff)}
.article-card:hover{border-color:#9bbef2;box-shadow:0 20px 48px rgba(31,68,120,.11)}
.article-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:12px;bottom:-35px;background:rgba(20,107,255,.06)}
.contact{background:#fff}.contact>a{color:#15233a}
footer{background:rgba(255,255,255,.9)}
.progress{height:3px;background:linear-gradient(90deg,#146BFF,#00B8D9,#7A4DFF)}
@media(max-width:560px){.live-badge{display:none}}


/* AnasseTech V8.2 — Light/Dark Premium balance */
:root {
  --at-ink: #172033;
  --at-ink-strong: #0b1220;
  --at-slate: #334155;
  --at-night: #111827;
  --at-blue: #2563eb;
  --at-cyan: #0891b2;
  --at-violet: #7c3aed;
}

/* Deeper typography for stronger contrast */
body {
  color: var(--at-ink);
}

h1, h2, h3, h4 {
  color: var(--at-ink-strong);
}

.navbar,
header {
  box-shadow: 0 1px 0 rgba(15, 23, 42, .08);
}

/* Darker premium cards / sections */
.dark-card,
.premium-dark,
.feature-dark {
  background: linear-gradient(135deg, #111827, #1e293b);
  color: #f8fafc;
}

.dark-card h1, .dark-card h2, .dark-card h3,
.premium-dark h1, .premium-dark h2, .premium-dark h3,
.feature-dark h1, .feature-dark h2, .feature-dark h3 {
  color: #ffffff;
}

/* Dark footer gives the page a stronger visual anchor */
footer {
  background: linear-gradient(135deg, #0f172a, #172033);
  color: #cbd5e1;
}

footer h1, footer h2, footer h3, footer h4 {
  color: #ffffff;
}

/* Buttons keep the colorful high-tech identity */
.btn-primary, .button-primary, .cta {
  background: linear-gradient(135deg, var(--at-blue), var(--at-violet));
  color: #ffffff;
}

/* Subtle darker borders for a more premium feel */
.card, .article-card, .video-card, .collaboration-card {
  border-color: rgba(15, 23, 42, .12);
}

/* V8.3 — Behind the scenes gallery */
.gallery { background: #f1f5f9; }
.gallery .head { margin-bottom: 42px; }
.gallery-grid { display:grid; grid-template-columns: 1.4fr 1fr 1fr; grid-auto-rows: 260px; gap:18px; }
.gallery-item { position:relative; display:block; padding:0; border:0; overflow:hidden; border-radius:24px; cursor:pointer; background:#0f172a; box-shadow:0 18px 45px rgba(15,23,42,.12); text-align:left; }
.gallery-item.gallery-large { grid-row: span 2; }
.gallery-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .55s ease, filter .55s ease; }
.gallery-item::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 45%, rgba(2,6,23,.88)); opacity:.85; }
.gallery-item span { position:absolute; z-index:2; left:22px; right:22px; bottom:20px; display:flex; flex-direction:column; gap:4px; color:#fff; }
.gallery-item b { font-size:12px; letter-spacing:.16em; color:#67e8f9; }
.gallery-item small { font-size:15px; font-weight:600; }
.gallery-item:hover img { transform:scale(1.045); filter:saturate(1.08); }
.gallery-item:focus-visible { outline:3px solid #2563eb; outline-offset:4px; }
.gallery-note { display:flex; align-items:center; gap:28px; margin-top:26px; flex-wrap:wrap; font-size:11px; letter-spacing:.12em; font-weight:800; color:#475569; }
.gallery-note .text-link { margin-left:auto; color:#1d4ed8; }
.gallery-lightbox { position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:30px; background:rgba(2,6,23,.88); backdrop-filter:blur(10px); }
.gallery-lightbox.is-open { display:flex; }
.gallery-modal { width:min(1100px, 94vw); max-height:90vh; display:flex; flex-direction:column; gap:14px; }
.gallery-modal img { width:100%; max-height:75vh; object-fit:contain; border-radius:20px; background:#0f172a; box-shadow:0 30px 80px rgba(0,0,0,.45); }
.gallery-modal div { color:#fff; padding:0 6px; }
.gallery-modal small { color:#67e8f9; text-transform:uppercase; letter-spacing:.14em; font-weight:800; }
.gallery-modal p { margin:5px 0 0; color:#cbd5e1; }
.gallery-close { position:absolute; top:22px; right:26px; width:48px; height:48px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08); color:#fff; font-size:30px; cursor:pointer; }
@media (max-width: 900px) { .gallery-grid { grid-template-columns:1fr 1fr; grid-auto-rows:220px; } .gallery-item.gallery-large { grid-row:span 2; } .gallery-note .text-link { margin-left:0; width:100%; } }
@media (max-width: 600px) { .gallery-grid { grid-template-columns:1fr; grid-auto-rows:240px; } .gallery-item.gallery-large { grid-row:auto; } .gallery-note { gap:14px; } }


/* AnasseTech V8.4 — Visual Setup Cards */
.setup-section {
  padding: 80px 0;
  position: relative;
}

.section-heading {
  max-width: 760px;
  margin-bottom: 32px;
}

.eyebrow {
  display: inline-block;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
  color: #2563eb;
  margin-bottom: 8px;
}

.section-heading h2 {
  margin: 0 0 10px;
  color: #0b1220;
}

.section-heading p {
  margin: 0;
  color: #475569;
}

.setup-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.setup-card {
  overflow: hidden;
  border-radius: 22px;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, .11);
  box-shadow: 0 14px 35px rgba(15, 23, 42, .09);
  transition: transform .25s ease, box-shadow .25s ease;
}

.setup-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 48px rgba(15, 23, 42, .15);
}

.setup-visual {
  height: 210px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  color: #fff;
  font-weight: 900;
  letter-spacing: .08em;
  font-size: 1.15rem;
}

.setup-visual::before,
.setup-visual::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  filter: blur(1px);
  opacity: .55;
}

.setup-visual::before {
  width: 170px;
  height: 170px;
  background: rgba(255,255,255,.11);
  transform: translate(-55px, -35px);
}

.setup-visual::after {
  width: 110px;
  height: 110px;
  background: rgba(255,255,255,.08);
  transform: translate(70px, 45px);
}

.setup-visual span {
  position: relative;
  z-index: 2;
  padding: 12px 18px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 14px;
  background: rgba(15,23,42,.28);
  backdrop-filter: blur(8px);
}

.camera-visual {
  background: linear-gradient(135deg, #0f172a, #1d4ed8);
}
.mic-visual {
  background: linear-gradient(135deg, #111827, #475569);
}
.monitor-visual {
  background: linear-gradient(135deg, #0f172a, #0891b2);
}
.tripod-visual {
  background: linear-gradient(135deg, #111827, #7c3aed);
}

.setup-card-body {
  padding: 22px;
}

.setup-brand {
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  color: #64748b;
}

.setup-card h3 {
  margin: 7px 0 8px;
  color: #0b1220;
  font-size: 1.18rem;
}

.setup-card p {
  margin: 0 0 16px;
  color: #475569;
  line-height: 1.55;
  min-height: 50px;
}

.setup-tag {
  display: inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
}

@media (max-width: 1000px) {
  .setup-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .setup-section { padding: 56px 0; }
  .setup-grid { grid-template-columns: 1fr; }
  .setup-visual { height: 190px; }
}

/* V8.5 — real photo gallery */
.gallery-item img,
.setup-photo img,
.setup-visual.real-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.gallery-item {
  cursor: pointer;
}
.gallery-item:hover img,
.setup-photo:hover img {
  transform: scale(1.035);
}
.gallery-item img,
.setup-photo img {
  transition: transform .35s ease;
}
.setup-visual.real-photo {
  padding: 0;
  background: #0f172a;
}
.setup-visual.real-photo img {
  position: absolute;
  inset: 0;
}
.setup-visual.real-photo::before,
.setup-visual.real-photo::after {
  z-index: 1;
}
.setup-visual.real-photo span {
  z-index: 3;
  position: absolute;
  left: 16px;
  bottom: 14px;
}
.setup-photo-strip {
  margin-top: 34px;
  padding: 28px;
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 24px;
  background: linear-gradient(135deg,#0f172a,#172554);
  color: #fff;
}
.setup-photo-heading span {
  color: #67e8f9;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .14em;
}
.setup-photo-heading h3 {
  margin: 6px 0 6px;
  color: #fff;
}
.setup-photo-heading p {
  margin: 0 0 18px;
  color: #cbd5e1;
}
.setup-photo-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 14px;
}
.setup-photo {
  border: 0;
  padding: 0;
  height: 210px;
  overflow: hidden;
  border-radius: 16px;
  cursor: pointer;
  background: #111827;
}
.setup-photo:focus-visible,
.gallery-item:focus-visible {
  outline: 3px solid #22d3ee;
  outline-offset: 3px;
}
@media (max-width: 700px) {
  .setup-photo-strip { padding: 20px; }
  .setup-photo-grid { grid-template-columns: 1fr; }
  .setup-photo { height: 220px; }
}

/* V9.0 — Approved AnasseTech hero banner */
.site-hero-banner{width:100%;margin:0 0 30px;background:#030611}
.site-hero-banner-inner{position:relative;width:100%;overflow:hidden;background:#030611}
.site-hero-image{display:block;width:100%;height:auto;max-height:720px;object-fit:cover;object-position:center top}
.site-hero-overlay{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:center;padding:20px 24px 24px;background:linear-gradient(to top,rgba(3,6,17,.92),rgba(3,6,17,.12),transparent);pointer-events:none}
.site-hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;pointer-events:auto}
.site-hero-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:11px;text-decoration:none;font-weight:850;font-size:.88rem;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px);transition:transform .2s ease}
.site-hero-btn-primary{color:#06101f;background:linear-gradient(90deg,#67e8f9,#60a5fa)}
.site-hero-btn-secondary{color:#fff;background:rgba(8,12,30,.78)}
.site-hero-btn:hover{transform:translateY(-2px)}
@media(max-width:900px){
  .site-hero-banner{margin-bottom:20px}
  .site-hero-image{min-height:260px;object-fit:cover;object-position:center top}
  .site-hero-overlay{position:relative;padding:12px 16px 16px;background:#030611}
  .site-hero-actions{width:100%;display:grid;grid-template-columns:1fr}
  .site-hero-btn{width:100%}
}

/* V9.1 — homepage: avoid duplicating navigation already included in approved hero artwork */
body > header:first-of-type,
.site-header,
header.site-header,
body > nav:first-of-type {
  display: none !important;
}

/* The hero artwork is the first visible element; remove extra top spacing. */
.site-hero-banner {
  margin-top: 0 !important;
}
.site-hero-image {
  width: 100%;
  display: block;
}
@media (max-width:700px) {
  .site-hero-image {
    width: 100%;
    height: auto;
    min-height: 0;
    object-fit: contain;
    object-position: center top;
  }
}

.site-hero-overlay {
  display: none !important;
}


/* V10.0 — Conseil & Expertise */
.consulting-section{
  position:relative;
  overflow:hidden;
  padding:76px 20px 88px;
  background:
    radial-gradient(circle at 12% 10%,rgba(37,99,235,.10),transparent 28%),
    radial-gradient(circle at 90% 30%,rgba(124,58,237,.09),transparent 30%),
    #f8fafc;
}
.consulting-container{max-width:1180px;margin:auto}
.consulting-heading{max-width:820px;margin:0 auto 38px;text-align:center}
.consulting-kicker{display:inline-block;color:#2563eb;font-size:.72rem;font-weight:900;letter-spacing:.15em}
.consulting-heading h2{margin:10px 0 14px;color:#0b1220;font-size:clamp(2rem,4vw,3.5rem);line-height:1.05;letter-spacing:-.04em}
.consulting-heading h2 strong{background:linear-gradient(90deg,#2563eb,#7c3aed);-webkit-background-clip:text;background-clip:text;color:transparent}
.consulting-heading p{margin:0;color:#64748b;font-size:1.02rem;line-height:1.7}
.consulting-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.consulting-card{padding:25px;border:1px solid rgba(15,23,42,.08);border-radius:22px;background:rgba(255,255,255,.88);box-shadow:0 12px 32px rgba(15,23,42,.06)}
.consulting-card-special{background:linear-gradient(135deg,#f1f5ff,#f7f1ff)}
.consulting-icon{width:48px;height:48px;display:grid;place-items:center;margin-bottom:17px;border-radius:15px;background:linear-gradient(135deg,#dbeafe,#ede9fe);color:#2563eb;font-size:1.35rem;font-weight:900}
.consulting-card h3{margin:0 0 9px;color:#0b1220;font-size:1.08rem}
.consulting-card p{margin:0;color:#64748b;line-height:1.55;font-size:.92rem}
.consulting-difference{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center;margin:52px 0;padding:32px;border-radius:28px;background:#071125;color:#fff}
.consulting-difference h3{margin:8px 0 10px;font-size:1.7rem}
.consulting-difference p{margin:0;color:#cbd5e1;line-height:1.6}
.consulting-points{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.consulting-points span{padding:13px 14px;border:1px solid rgba(103,232,249,.16);border-radius:13px;background:rgba(255,255,255,.04);color:#e2e8f0;font-size:.84rem}
.consulting-offers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.consulting-offer{position:relative;padding:28px;border-radius:24px;background:#fff;border:1px solid rgba(15,23,42,.09);box-shadow:0 14px 35px rgba(15,23,42,.06)}
.consulting-offer.featured{border:1px solid rgba(37,99,235,.28);box-shadow:0 18px 45px rgba(37,99,235,.12);transform:translateY(-6px)}
.offer-label{color:#2563eb;font-size:.72rem;font-weight:900;letter-spacing:.1em}
.consulting-offer h3{margin:9px 0 10px;color:#0b1220}
.consulting-offer p{min-height:70px;margin:0 0 20px;color:#64748b;line-height:1.55;font-size:.9rem}
.consulting-offer a{color:#2563eb;text-decoration:none;font-weight:850}
.consulting-cta{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:42px;padding:28px 30px;border-radius:25px;background:linear-gradient(100deg,#0b1220,#172554);color:#fff}
.consulting-cta h3{margin:7px 0 7px;font-size:1.55rem}
.consulting-cta p{margin:0;color:#cbd5e1}
.consulting-cta-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;min-height:48px;padding:0 18px;border-radius:12px;text-decoration:none;color:#06101f;background:linear-gradient(90deg,#67e8f9,#60a5fa);font-weight:900}
@media(max-width:850px){
 .consulting-grid,.consulting-offers{grid-template-columns:repeat(2,1fr)}
 .consulting-difference{grid-template-columns:1fr}
}
@media(max-width:600px){
 .consulting-section{padding:54px 16px 64px}
 .consulting-grid,.consulting-offers{grid-template-columns:1fr}
 .consulting-difference{margin:38px 0;padding:24px;border-radius:22px}
 .consulting-points{grid-template-columns:1fr}
 .consulting-offer.featured{transform:none}
 .consulting-cta{flex-direction:column;align-items:flex-start;padding:24px}
 .consulting-cta-btn{width:100%}
}

/* V10.1 — TEST LAB is an actual interactive card */
.hero-art-link{
  display:block;
  color:inherit;
  text-decoration:none;
  cursor:pointer;
}
.hero-art-link:hover .hero-card{
  transform:translateY(-4px) rotate(-2deg);
  box-shadow:0 26px 60px rgba(37,99,235,.18);
}
.hero-card{transition:transform .22s ease, box-shadow .22s ease}

/* V10.1 — footer brand contrast */
footer .logo,
footer .logo > span:last-child{
  color:#ffffff !important;
}
footer .logo > span:last-child > span{
  color:#67e8f9 !important;
}
footer .mark{
  color:#1677ff !important;
  background:#ffffff !important;
  border-color:rgba(255,255,255,.55) !important;
}
footer{
  color:#dbe7f5 !important;
}
footer a{
  color:#ffffff !important;
}

/* V10.2 — Conseil CTA contrast fix */
.consulting-cta{
  background:linear-gradient(110deg,#0b1835 0%,#172b66 100%) !important;
  color:#ffffff !important;
}
.consulting-cta .consulting-kicker{
  color:#5ab7ff !important;
}
.consulting-cta h3{
  color:#ffffff !important;
}
.consulting-cta p{
  color:#e8f0ff !important;
}
.consulting-cta-btn{
  color:#ffffff !important;
  background:linear-gradient(90deg,#19d7f5 0%,#4f8cff 55%,#7c4dff 100%) !important;
  box-shadow:0 10px 28px rgba(37,99,235,.22);
}
@media(max-width:600px){
  .consulting-cta h3{font-size:1.45rem;line-height:1.15}
  .consulting-cta p{font-size:.98rem;line-height:1.55}
}

.yt-latest-section{padding:76px 20px;background:#fff}.yt-container{max-width:1180px;margin:auto}.yt-head{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:28px}.yt-kicker{color:#e11d48;font-size:.72rem;font-weight:900;letter-spacing:.15em}.yt-head h2{margin:8px 0;color:#0b1220;font-size:clamp(2rem,3.5vw,3rem)}.yt-head p{margin:0;color:#64748b}.yt-channel-btn{padding:11px 15px;border-radius:11px;text-decoration:none;color:#fff;background:#111827;font-weight:850}.yt-feature{display:grid;grid-template-columns:1.35fr .65fr;gap:24px;align-items:stretch;padding:18px;border-radius:26px;background:linear-gradient(135deg,#f1f5f9,#eef3ff);border:1px solid #dfe7f2}.yt-player-wrap{overflow:hidden;border-radius:18px;aspect-ratio:16/9;background:#050817}.yt-player-wrap iframe{width:100%;height:100%;border:0}.yt-feature-copy{padding:20px;display:flex;flex-direction:column;justify-content:center}.yt-feature-copy>span{font-size:.7rem;font-weight:900;letter-spacing:.12em;color:#2563eb}.yt-feature-copy h3{margin:10px 0;color:#0b1220;font-size:1.65rem}.yt-feature-copy p{color:#64748b;line-height:1.6}.yt-feature-copy a{color:#2563eb;font-weight:900;text-decoration:none}.testlab-section{padding:76px 20px;background:#071125;color:#fff}.testlab-container{max-width:1180px;margin:auto}.testlab-head{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:end;margin-bottom:32px}.testlab-head>div>span{color:#67e8f9;font-size:.72rem;font-weight:900;letter-spacing:.15em}.testlab-head h2{margin:9px 0 0;font-size:clamp(2rem,4vw,3.6rem);line-height:1.02}.testlab-head h2 em{color:#67e8f9;font-style:normal}.testlab-head>p{margin:0;color:#cbd5e1;line-height:1.65}.testlab-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.testlab-grid article{padding:24px;border:1px solid rgba(103,232,249,.14);border-radius:20px;background:rgba(255,255,255,.045)}.testlab-grid b{color:#67e8f9}.testlab-grid h3{margin:12px 0 8px;color:#fff}.testlab-grid p{margin:0;color:#aebbd0;line-height:1.55}.consulting-form{margin-top:28px;padding:24px;border-radius:22px;background:#fff;border:1px solid #dbe3ef}.consulting-form h4{margin:0 0 16px;color:#0b1220}.consulting-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.consulting-form input,.consulting-form select,.consulting-form textarea{box-sizing:border-box;width:100%;border:1px solid #d8e0eb;border-radius:11px;padding:12px;background:#f8fafc;font:inherit}.consulting-form textarea{margin-top:11px}.consulting-form button{margin-top:11px;min-height:44px;border:0;border-radius:11px;padding:0 17px;background:linear-gradient(90deg,#19d7f5,#4f8cff,#7c4dff);color:#fff;font-weight:900}.consulting-form small{display:block;margin-top:9px;color:#64748b}@media(max-width:900px){.yt-feature,.testlab-head{grid-template-columns:1fr}.testlab-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.yt-head{flex-direction:column;align-items:flex-start}.yt-feature{padding:10px}.testlab-grid,.consulting-form-grid{grid-template-columns:1fr}}

/* V12 — architecture multi-pages : navigation + pages plus courtes */
.header nav a{position:relative;text-decoration:none}
.header nav a.active{color:#146BFF;font-weight:800}
.header nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:2px;border-radius:99px;background:linear-gradient(90deg,#146BFF,#7A4DFF)}
.page-hero{padding:72px 20px 54px;background:linear-gradient(135deg,#f6f9ff 0%,#eef5ff 50%,#f8f4ff 100%);border-bottom:1px solid #dfe7f2}
.page-hero-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
.page-kicker{font-size:.72rem;letter-spacing:.16em;font-weight:900;color:#2563eb}
.page-hero h1{margin:13px 0 0;font-size:clamp(2.8rem,6vw,5.8rem);line-height:.9;letter-spacing:-.055em;color:#0b1220}
.page-hero h1 em{font-style:normal;background:linear-gradient(90deg,#146BFF,#00A9D6,#7A4DFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero p{max-width:650px;margin:22px 0 0;color:#5f6f84;font-size:1rem;line-height:1.65}
.page-hero-meta{min-width:190px;padding:18px;border:1px solid #cbd9ea;border-radius:18px;background:rgba(255,255,255,.72);display:flex;flex-direction:column;gap:8px;font-size:.65rem;letter-spacing:.14em;font-weight:900;color:#64748b}
.explore-section{background:#f7f9fc;border-top:1px solid #e3eaf3;border-bottom:1px solid #e3eaf3}
.explore-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.explore-card{min-height:190px;padding:25px;border-radius:20px;border:1px solid #dbe5f1;background:linear-gradient(145deg,#fff,#f8fbff);text-decoration:none;color:#0b1220;transition:.2s;display:flex;flex-direction:column}
.explore-card:hover{transform:translateY(-4px);border-color:#9fc3ff;box-shadow:0 18px 45px rgba(31,74,135,.1)}
.explore-card span{font-size:.7rem;color:#2563eb;font-weight:900}.explore-card h3{margin:20px 0 7px;font-size:1.25rem}.explore-card p{margin:0;color:#64748b;line-height:1.55;font-size:.9rem}.explore-card b{margin-top:auto;padding-top:18px;color:#2563eb;font-size:.8rem}
.contact-extra{padding:70px 20px;background:#f7f9fc}.contact-extra>div{max-width:1180px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-card{padding:30px;border:1px solid #dbe5f1;border-radius:22px;background:#fff}.contact-card span{font-size:.7rem;letter-spacing:.14em;font-weight:900;color:#2563eb}.contact-card h3{margin:11px 0 8px;color:#0b1220;font-size:1.5rem}.contact-card p{color:#64748b;line-height:1.6}.contact-card a{display:inline-block;margin-top:8px;color:#2563eb;font-weight:900;text-decoration:none}
@media(max-width:900px){.page-hero-inner{flex-direction:column;align-items:flex-start}.page-hero-meta{width:100%;box-sizing:border-box}.explore-grid{grid-template-columns:1fr 1fr}.header nav a.active::after{display:none}}
@media(max-width:600px){.page-hero{padding:54px 16px 42px}.page-hero h1{font-size:clamp(2.7rem,13vw,4.2rem)}.explore-grid,.contact-extra>div{grid-template-columns:1fr}.explore-card{min-height:165px}.contact-extra{padding:52px 16px}}


/* V13 — Make the CTA embedded in the hero artwork clickable.
   The visible CTA is part of the approved banner image; this transparent
   hotspot routes visitors to the Expertise & Conseil page. */
.site-hero-banner-inner { position: relative; }
.hero-cta-hotspot {
  position: absolute;
  z-index: 20;
  right: 4.5%;
  bottom: 6.5%;
  width: 18%;
  height: 15%;
  display: block;
  background: transparent;
  border-radius: 12px;
  cursor: pointer;
}
.hero-cta-hotspot:focus-visible {
  outline: 3px solid #60a5fa;
  outline-offset: 4px;
}
@media (max-width: 700px) {
  .hero-cta-hotspot {
    right: 4%;
    bottom: 5%;
    width: 27%;
    height: 18%;
  }
}


/* V14 — Functional navigation and banner hotspots */
.nav-shell {
  gap: 18px;
}
.nav-shell .nav-links {
  display:flex;
  align-items:center;
  gap:28px;
  color:#9199a4;
  font-size:11px;
}
.nav-shell .nav-links > a,
.nav-drop-trigger {
  color:inherit;
  font:inherit;
  text-decoration:none;
}
.nav-drop-trigger {
  background:none;
  border:0;
  padding:0;
  cursor:pointer;
}
.nav-drop-trigger:hover,
.nav-shell .nav-links > a:hover { color:#fff; }
.nav-dropdown { position:relative; }
.nav-drop-menu {
  position:absolute;
  top:28px;
  left:50%;
  transform:translateX(-50%);
  min-width:225px;
  padding:7px;
  border:1px solid #292e36;
  border-radius:12px;
  background:#0d0f13;
  box-shadow:0 20px 60px #000;
  z-index:50;
}
.nav-drop-menu a {
  display:block;
  padding:11px 12px;
  border-radius:8px;
  color:#cbd0d7;
  font-size:10px;
}
.nav-drop-menu a:hover { background:#171b22; color:#fff; }

.site-hero-banner-inner { position:relative; overflow:hidden; }
.banner-hotspots { position:absolute; inset:0; z-index:15; pointer-events:none; }
.banner-hotspot {
  position:absolute;
  display:block;
  border:0;
  background:transparent;
  cursor:pointer;
  pointer-events:auto;
  padding:0;
}
.hs-home       { left:12.0%; top:3%; width:6.5%; height:9%; }
.hs-youtube    { left:19.0%; top:3%; width:6.5%; height:9%; }
.hs-tests      { left:25.5%; top:3%; width:5.5%; height:9%; }
.hs-categories { left:30.5%; top:3%; width:9%; height:9%; }
.hs-services   { left:39.5%; top:3%; width:12%; height:9%; }
.hs-contact    { left:51.0%; top:3%; width:7%; height:9%; }
.hs-social-youtube    { right:6.0%; top:2%; width:3.2%; height:10%; }
.hs-social-instagram  { right:2.2%; top:2%; width:3.2%; height:10%; }
.hs-cta { right:3.0%; bottom:17%; width:20%; height:15%; }

.banner-category-menu {
  position:absolute;
  left:30%;
  top:11%;
  width:240px;
  padding:8px;
  border:1px solid #3b4050;
  border-radius:12px;
  background:rgba(8,10,15,.97);
  box-shadow:0 18px 55px rgba(0,0,0,.55);
  z-index:30;
  pointer-events:auto;
}
.banner-category-menu a {
  display:block;
  padding:10px 12px;
  color:#fff;
  font-size:11px;
  border-radius:7px;
}
.banner-category-menu a:hover { background:#191d26; }

.yt-placeholder {
  min-height:420px;
  border:1px solid #252a31;
  border-radius:17px;
  background:
    radial-gradient(circle at 70% 30%, #27314a, #11151d 45%, #090a0d 75%);
  display:grid;
  place-items:center;
  text-align:center;
}
.yt-placeholder-inner {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
  padding:30px;
}
.yt-placeholder-inner span {
  font-size:9px;
  letter-spacing:2px;
  color:#7d8795;
}
.yt-placeholder-inner strong {
  font-size:clamp(28px,4vw,48px);
  line-height:1;
  letter-spacing:-2px;
}
.yt-placeholder-inner .btn { margin-top:4px; }

@media (max-width: 900px) {
  .nav-shell .nav-links { display:none; }
  .nav-shell .menu { display:block; }
  .nav-shell.nav-mobile-open .nav-links {
    display:flex;
    position:absolute;
    top:76px;
    left:18px;
    right:18px;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:8px;
    border:1px solid #292e36;
    border-radius:14px;
    background:#0d0f13;
    box-shadow:0 20px 60px #000;
    z-index:60;
  }
  .nav-shell.nav-mobile-open .nav-links > a,
  .nav-shell.nav-mobile-open .nav-drop-trigger {
    display:block;
    width:100%;
    text-align:left;
    padding:14px 12px;
    border-bottom:1px solid #20242a;
  }
  .nav-shell.nav-mobile-open .nav-dropdown { position:static; }
  .nav-shell.nav-mobile-open .nav-drop-menu {
    position:static;
    transform:none;
    min-width:0;
    box-shadow:none;
    border:0;
    border-radius:8px;
    margin:0 4px 6px;
  }
  .banner-hotspots { display:block; }
}

@media (max-width: 600px) {
  .hs-home       { left:11%; width:7%; }
  .hs-youtube    { left:18%; width:8%; }
  .hs-tests      { left:26%; width:7%; }
  .hs-categories { left:33%; width:11%; }
  .hs-services   { left:44%; width:14%; }
  .hs-contact    { left:58%; width:9%; }
  .hs-cta { right:4%; bottom:16%; width:28%; height:18%; }
  .banner-category-menu { left:31%; width:205px; }
}


/* V16 — REAL HTML UI over the approved artwork. The artwork is only the background. */
.functional-banner{position:relative!important;width:100%!important;margin:0!important;background:#030611!important;overflow:visible!important;isolation:isolate;}
.functional-banner-bg{width:100%;aspect-ratio:1983/793;background-image:url('assets/anassetech-hero-banner.png');background-size:100% 100%;background-repeat:no-repeat;background-position:center top;}
.functional-banner-ui{position:absolute!important;inset:0!important;z-index:100!important;pointer-events:none!important;}
.fb-nav{position:absolute;left:0;right:0;top:0;height:15%;pointer-events:auto!important;display:flex;align-items:center;justify-content:center;}
.fb-logo{position:absolute;left:1.5%;top:34%;font-weight:900;font-size:clamp(10px,1.05vw,20px);letter-spacing:-.05em;color:#fff;text-decoration:none;text-shadow:0 1px 8px #000;}
.fb-logo b{color:#38a7ff;margin-left:3px;}
.fb-links{display:flex;align-items:center;justify-content:center;gap:clamp(10px,2.1vw,42px);padding-top:2%;}
.fb-links>a,.fb-drop-btn{color:#fff;text-decoration:none;font:800 clamp(7px,.62vw,13px)/1 Inter,Arial,sans-serif;letter-spacing:.02em;text-shadow:0 1px 6px #000;background:none;border:0;cursor:pointer;padding:8px 2px;}
.fb-links>a:hover,.fb-drop-btn:hover{color:#62b7ff;}
.fb-drop{position:relative;}
.fb-drop-menu{position:absolute;top:34px;left:50%;transform:translateX(-50%);width:210px;padding:7px;border:1px solid #4b5568;border-radius:10px;background:rgba(6,9,17,.98);box-shadow:0 18px 50px #000;z-index:200;}
.fb-drop-menu a{display:block;color:#fff;text-decoration:none;font:600 11px/1.2 Inter,Arial,sans-serif;padding:10px;border-radius:7px;}
.fb-drop-menu a:hover{background:#182130;}
.fb-hit{position:absolute!important;display:block!important;background:transparent!important;border:0!important;padding:0!important;margin:0!important;cursor:pointer!important;pointer-events:auto!important;z-index:120!important;}
.fb-hit-home{left:12%;top:2%;width:6%;height:11%;}.fb-hit-youtube{left:19%;top:2%;width:7%;height:11%;}.fb-hit-tests{left:26%;top:2%;width:6%;height:11%;}.fb-hit-categories{left:32%;top:2%;width:10%;height:11%;}.fb-hit-services{left:42%;top:2%;width:14%;height:11%;}.fb-hit-contact{left:56%;top:2%;width:9%;height:11%;}
.fb-hit-yticon{right:5.8%;top:1.5%;width:3.1%;height:12%;}.fb-hit-ig{right:1.9%;top:1.5%;width:3.1%;height:12%;}
.fb-cta{position:absolute;right:7.5%;bottom:18%;width:22%;height:16%;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;text-decoration:none;color:#fff;font:900 clamp(9px,1.15vw,22px)/1.08 Inter,Arial,sans-serif;letter-spacing:.02em;border-radius:12px;background:linear-gradient(90deg,#0797ff,#7900ff);box-shadow:0 12px 30px rgba(57,0,255,.35);pointer-events:auto;z-index:130;}
.fb-cta span{font-size:1.3em;line-height:1;}
.fb-mobile,.fb-mobile-menu{display:none;}
/* The legacy page hid the real header because the old artwork was treated as static UI. Keep it hidden: V16 puts real HTML UI on the artwork itself. */
body>header:first-of-type{display:none!important;}
.site-hero-overlay{display:none!important;}

@media(max-width:900px){
  .functional-banner-bg{aspect-ratio:1983/793;background-size:cover;background-position:center top;min-height:250px;}
  .fb-links{display:none;}
  .fb-logo{left:3%;top:29%;font-size:12px;}
  .fb-mobile{display:block;position:absolute;right:3%;top:18%;width:42px;height:36px;border:1px solid rgba(255,255,255,.55);border-radius:9px;background:rgba(5,7,13,.8);color:#fff;font-size:20px;cursor:pointer;z-index:300;}
  .fb-mobile-menu{position:absolute;right:3%;top:72px;width:210px;padding:8px;border-radius:12px;background:rgba(7,9,15,.98);border:1px solid #465064;box-shadow:0 20px 60px #000;z-index:400;}
  .fb-mobile-menu a{display:block;color:#fff;text-decoration:none;padding:13px;font:700 12px Inter,Arial,sans-serif;border-bottom:1px solid #252a33;}
  .fb-mobile-menu a:last-child{border-bottom:0;}
  .fb-hit{display:none!important;}
  .fb-cta{right:6%;bottom:10%;width:39%;height:16%;font-size:10px;border-radius:9px;}
}


/* ZIP20 — global mobile viewport width correction */
html, body { width:100% !important; min-width:100% !important; margin:0 !important; }
body { max-width:none !important; overflow-x:hidden !important; }
main, header, footer, section { max-width:none !important; }
@media (max-width:700px) {
  .site-hero-banner, .hero, .testlab-section, .yt-latest-section { width:100% !important; max-width:none !important; }
}