/* Sekcja Celebrissio — U71 (23.10.2026): motorsagent.com slajd 02, motorsbot.com slajd 07.
   Zastępuje style sekcji .cb-u71 z pakietu 02 v6.2. Sekcja ma własne ciemne tło (nie zmienia się z motywem). */
.cb-u71{--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;position:relative;overflow:hidden;background:#0B0A0A;color:#F5F5F6;font-family:"Manrope U72",system-ui,sans-serif;padding:76px 96px 80px;display:grid;grid-template-columns:minmax(0,1fr) 520px;gap:80px;align-items:center;border-top:1px solid rgba(255,255,255,.06)}
.cb-u71::before{content:"";position:absolute;right:-120px;top:-120px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(212,175,55,.22),transparent 65%);pointer-events:none}
.cb-u71>div,.cb-u71>figure{position:relative}
.cb-u71 .over{font:600 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#E3C560;display:flex;align-items:center;gap:10px}
.cb-u71 .over::before{content:"";width:8px;height:8px;border-radius:50%;background:#C9A227}
.cb-u71 h2{font:800 40px/1.1 "Manrope U72",sans-serif;margin:14px 0 12px;letter-spacing:-.02em}
.cb-u71 h2 .g{background:linear-gradient(180deg,#F6E27A,#B8860B);-webkit-background-clip:text;background-clip:text;color:transparent}
.cb-u71 .lead{color:rgba(245,245,246,.72);max-width:60ch;font-size:16px;line-height:1.5;margin:0}
.cb-u71 .cbb{display:inline-flex;align-items:center;gap:11px;padding:8px 16px 8px 9px;border-radius:10px;border:1px solid rgba(212,175,55,.55);background:linear-gradient(180deg,rgba(212,175,55,.14),rgba(212,175,55,.03));text-decoration:none;margin-top:18px}
.cb-u71 .cbb img{width:30px;height:30px;display:block}
.cb-u71 .cbb span{display:block}
.cb-u71 .cbb b{display:block;font:800 17px/1 "Manrope U72",sans-serif;letter-spacing:-.01em;background:linear-gradient(180deg,#F7E39A,#D4AF37 55%,#B8891E);-webkit-background-clip:text;background-clip:text;color:transparent}
.cb-u71 .cbb small{display:block;margin-top:4px;font:700 8.5px/1 "Space Mono","JetBrains Mono",monospace;letter-spacing:.16em;color:#D9B54A}
.cb-u71 .pills{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.cb-u71 .pill{font:600 11px var(--mono);letter-spacing:.1em;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:rgba(245,245,246,.7)}
/* NOWE: odznaka pod tekstem + blok dla warsztatów i mechaników */
.cb-u71 .join{display:grid;grid-template-columns:172px minmax(0,1fr);gap:28px;align-items:center;margin-top:32px;padding-top:28px;border-top:1px solid rgba(255,255,255,.10)}
.cb-u71 .join .badge{width:172px;height:172px;display:block;filter:drop-shadow(0 14px 24px rgba(0,0,0,.55))}
.cb-u71 .join h3{font:800 21px/1.25 "Manrope U72",sans-serif;margin:0 0 8px;letter-spacing:-.01em}
.cb-u71 .join p{color:rgba(245,245,246,.72);font-size:15.5px;line-height:1.5;margin:0 0 16px;max-width:48ch}
.cb-u71 .jbtn{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:10px;background:linear-gradient(180deg,#F3D97A,#D4AF37 60%,#B8891E);color:#17120A;font:800 15px/1 "Manrope U72",sans-serif;text-decoration:none;box-shadow:0 8px 22px rgba(212,175,55,.22)}
.cb-u71 .jbtn:hover{filter:brightness(1.06)}
.cb-u71 .jbtn:focus-visible,.cb-u71 .cbb:focus-visible{outline:3px solid #F6E27A;outline-offset:3px}
.cb-u71 .jbtn svg{width:16px;height:16px;flex:none}
/* NOWE: zdjęcie (kadr 4:5) + warstwa telefonu na lewej krawędzi zdjęcia */
.cb-u71 .pic{margin:0;position:relative;width:520px;aspect-ratio:4/5}
.cb-u71 .pic>picture:first-child{display:block;width:100%;height:100%}
.cb-u71 .pic .ph0{display:block;width:100%;height:100%;object-fit:cover;border-radius:22px;box-shadow:0 30px 60px rgba(0,0,0,.45);outline:1px solid rgba(255,255,255,.08);outline-offset:-1px}
.cb-u71 .pic .ov{position:absolute;left:-17%;bottom:-6%;width:53%;height:auto;display:block;pointer-events:none}
@media (max-width:1439px){
  .cb-u71{padding:64px 56px 72px;gap:64px;grid-template-columns:minmax(0,1fr) 460px}
  .cb-u71 .pic{width:460px}
}
@media (max-width:1199px){
  .cb-u71{grid-template-columns:1fr;padding:44px 20px 52px;gap:30px}
  .cb-u71 h2{font-size:28px}
  .cb-u71 .lead{font-size:15px}
  .cb-u71 .join{grid-template-columns:104px minmax(0,1fr);gap:16px;margin-top:26px;padding-top:22px}
  .cb-u71 .join .badge{width:104px;height:104px}
  .cb-u71 .join h3{font-size:17px}
  .cb-u71 .join p{font-size:14px;margin-bottom:14px}
  .cb-u71 .jbtn{padding:12px 16px;font-size:14px}
  .cb-u71 .pic{width:100%;max-width:560px}
  .cb-u71 .pic .ov{left:3%;bottom:-7%;width:51%}
}

/* Sekcja skills4agent — U72 (26.10.2026): motorsagent.com slajd 03, motorsbot.com slajd 09 — zaraz po sekcji Celebrissio (U71).
   Wygląd marki skills4agent (granat, złoto, jasny błękit; Newsreader + Manrope + IBM Plex Mono). Sekcja ma własne ciemne tło (nie zmienia się z motywem). */
.s4sec{--mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--gold:#D8B35A;--gold2:#E6C77A;--blue:#9DB8E8;--ink:#0A1020;--fg:#ECEFF5;--fg2:rgba(236,239,245,.74);position:relative;overflow:hidden;background:linear-gradient(180deg,#0A1020,#0D1428);color:var(--fg);font-family:"Manrope U72",system-ui,sans-serif;padding:76px 96px 80px;display:grid;grid-template-columns:520px minmax(0,1fr);gap:80px;align-items:center;border-top:1px solid rgba(236,239,245,.08)}
.s4sec::before{content:"";position:absolute;left:-160px;bottom:-200px;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(157,184,232,.16),transparent 65%);pointer-events:none}
.s4sec::after{content:"";position:absolute;right:-140px;top:-160px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(216,179,90,.16),transparent 65%);pointer-events:none}
.s4sec>div,.s4sec>figure{position:relative;z-index:1}
.s4sec .over{font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);display:flex;align-items:center;gap:10px}
.s4sec .over::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--gold);box-shadow:10px 0 0 var(--blue);margin-right:10px}
.s4sec h2{font:600 44px/1.08 "Newsreader",Georgia,serif;margin:16px 0 14px;letter-spacing:-.01em;max-width:20ch}
.s4sec h2 .g{color:var(--gold);font-style:italic}
.s4sec .lead{color:var(--fg2);max-width:62ch;font-size:16px;line-height:1.55;margin:0}
.s4sec .steps{list-style:none;counter-reset:s;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.s4sec .steps li{counter-increment:s;padding:16px 16px 18px;border:1px solid rgba(236,239,245,.12);border-radius:12px;background:rgba(255,255,255,.035)}
.s4sec .steps li::before{content:counter(s);display:inline-grid;place-items:center;width:26px;height:26px;border-radius:7px;border:1px solid rgba(216,179,90,.6);color:var(--gold2);font:600 13px/1 var(--mono);margin-bottom:10px}
.s4sec .steps b{display:block;font:800 15px/1.3 "Manrope U72",sans-serif;margin-bottom:6px}
.s4sec .steps span{display:block;color:var(--fg2);font-size:13.5px;line-height:1.45}
.s4sec .acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:26px}
.s4sec .jbtn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:10px;background:var(--gold);color:var(--ink);font:800 15px/1 "Manrope U72",sans-serif;text-decoration:none;box-shadow:0 8px 22px rgba(216,179,90,.22)}
.s4sec .jbtn:hover{background:var(--gold2)}
.s4sec .jbtn svg{width:16px;height:16px;flex:none}
.s4sec .s4b{display:inline-flex;flex-direction:column;align-items:flex-start;gap:7px;padding:10px 16px 9px;border-radius:10px;border:1px solid rgba(157,184,232,.45);background:rgba(157,184,232,.07);text-decoration:none;color:var(--fg)}
.s4sec .s4b img{height:26px;width:auto;display:block}
.s4sec .s4b .url{display:inline-flex;align-items:center;gap:6px;font:500 13px/1 var(--mono);letter-spacing:.02em;color:var(--fg);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(157,184,232,.6)}
.s4sec .s4b .url svg{width:13px;height:13px;color:var(--blue)}
.s4sec .s4b:hover .url{color:#fff;text-decoration-color:var(--gold)}
.s4sec .jbtn:focus-visible,.s4sec .s4b:focus-visible{outline:3px solid var(--gold2);outline-offset:3px}
.s4sec .pills{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.s4sec .pill{font:500 11px var(--mono);letter-spacing:.1em;padding:8px 12px;border-radius:999px;border:1px solid rgba(236,239,245,.14);color:rgba(236,239,245,.7)}
/* zdjęcie (kadr 4:5) + karta „Nowa umiejętność” na dolnej części zdjęcia */
.s4sec .pic{margin:0;position:relative;width:520px;aspect-ratio:4/5;container-type:inline-size}
.s4sec .pic>picture{display:block;width:100%;height:100%}
.s4sec .pic .ph0{display:block;width:100%;height:100%;object-fit:cover;border-radius:22px;box-shadow:0 30px 60px rgba(0,0,0,.45);outline:1px solid rgba(255,255,255,.08);outline-offset:-1px}
.s4sec .skc{position:absolute;left:6%;bottom:6%;width:62%;padding:4.2cqw 4.6cqw;border-radius:3cqw;background:rgba(10,16,32,.9);border:1px solid rgba(216,179,90,.55);box-shadow:0 18px 40px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:2.7cqw;line-height:1.35}
.s4sec .skc.br{left:4%;bottom:3%;width:50%;font-size:2.5cqw}
.s4sec .skc-top{display:flex;align-items:center;gap:2cqw}
.s4sec .skc-top img{height:3.6cqw;width:auto;display:block}
.s4sec .skc-top em{margin-left:auto;font:500 1.9cqw/1 var(--mono);letter-spacing:.12em;color:var(--gold2);font-style:normal;border:1px solid rgba(216,179,90,.5);border-radius:99px;padding:1cqw 1.8cqw}
.s4sec .skc-t{font:600 3.9cqw/1.2 "Newsreader",Georgia,serif;color:var(--fg);margin:2.6cqw 0 1.8cqw}
.s4sec .skc-m,.s4sec .skc-ok{display:flex;align-items:center;gap:1.6cqw;color:var(--fg2)}
.s4sec .skc-ok{color:#86D19A;margin-top:1.2cqw;font-weight:700}
.s4sec .skc svg{width:3.2cqw;height:3.2cqw;flex:none}
@media (max-width:1439px){
  .s4sec{padding:64px 56px 72px;gap:64px;grid-template-columns:460px minmax(0,1fr)}
  .s4sec .pic{width:460px}
  .s4sec h2{font-size:40px}
}
@media (max-width:1199px){
  .s4sec{grid-template-columns:1fr;padding:44px 20px 52px;gap:30px}
  .s4sec .txt{order:-1}
  .s4sec h2{font-size:30px}
  .s4sec .lead{font-size:15px}
  .s4sec .steps{grid-template-columns:1fr;gap:10px}
  .s4sec .steps li{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:10px;padding:12px 14px}
  .s4sec .steps li::before{grid-row:span 2;margin:0}
  .s4sec .jbtn{padding:13px 18px;font-size:14px}
  .s4sec .pic{width:100%;max-width:560px}
  .s4sec .skc{width:74%;font-size:3.2cqw}
  .s4sec .skc.br{width:56%;font-size:2.7cqw;bottom:3%}
}
@media (prefers-reduced-motion:no-preference){.s4sec .jbtn{transition:background .15s}}

/* Integration with the existing slide shell and fixed 62px navigation. */
.responsive-picture{display:contents;}
.slide-alias{position:absolute;top:0;left:0;width:0;height:0;}
#slidesContainer>.cb-u71,#slidesContainer>.s4sec{display:grid;box-sizing:border-box;text-align:left;min-width:0;padding-top:138px;}
#slidesContainer>.cb-u71>div,#slidesContainer>.s4sec>.txt{min-width:0;}
#slidesContainer>.cb-u71{grid-template-columns:minmax(0,1fr) 520px;}
#slidesContainer>.s4sec{grid-template-columns:520px minmax(0,1fr);}
#celebrissio h2{font-size:calc(40px * var(--a11y-scale,1));color:#F5F5F6;text-align:left;}
#skills4agent h2{font-family:"Newsreader",Georgia,serif;font-size:calc(44px * var(--a11y-scale,1));font-weight:600;line-height:1.08;color:#ECEFF5;text-align:left;}
#skills4agent .lead{font-size:calc(16px * var(--a11y-scale,1));}
#skills4agent .skc-top em{white-space:nowrap;}
#skills4agent .skc{box-sizing:content-box;}
#skills4agent .steps{width:100%;}
#skills4agent .steps li,#celebrissio .join>div{min-width:0;}
#skills4agent .pill{background:transparent;}
#skills4agent .skc-t{font-family:"Newsreader",Georgia,serif;}
#celebrissio .jbtn,#skills4agent .jbtn{white-space:normal;line-height:1.25;}
#navShell .ib img{object-fit:contain;}
#navShell .ib img.neg{border-radius:0;}
@media(min-width:1200px) and (max-width:1299px){
 #navShell .bar{gap:4px;padding-inline:12px;}
 #navShell .grp{gap:1px;}
 #navShell .vsep{margin-inline:4px;}
 #navShell .ib{width:40px;}
}
@media(min-width:1200px) and (max-width:1439px){
 #slidesContainer>.cb-u71{grid-template-columns:minmax(0,1fr) 460px;padding-top:126px;}
 #slidesContainer>.s4sec{grid-template-columns:460px minmax(0,1fr);padding-top:126px;}
 #skills4agent h2{font-size:calc(40px * var(--a11y-scale,1));}
}
@media(max-width:1199px){
 #slidesContainer>.cb-u71,#slidesContainer>.s4sec{grid-template-columns:minmax(0,1fr);padding:106px 20px 76px;gap:30px;}
 #celebrissio h2{font-size:calc(28px * var(--a11y-scale,1));}
 #skills4agent h2{font-size:calc(30px * var(--a11y-scale,1));}
 #skills4agent .lead{font-size:calc(15px * var(--a11y-scale,1));}
 #tokenizacja .mbnft,#tokenizacja .mbw{width:calc(100% - 36px);align-self:center;}
 #tokenizacja .mbs-vis{height:380px;}
}
html[data-contrast="high"] :is(.cb-u71,.s4sec){background:#000;border-color:#fff;}
html[data-contrast="high"] :is(.cb-u71,.s4sec) :is(.lead,.pill,.join p,.steps span){color:#fff;}


/* Render decorative glows as backgrounds so they do not extend the native mobile page. */
#skills4agent{background:radial-gradient(circle 452px at 160px calc(100% - 120px),rgba(157,184,232,.16),transparent 65%),radial-gradient(circle 396px at calc(100% - 140px) 120px,rgba(216,179,90,.16),transparent 65%),linear-gradient(180deg,#0A1020,#0D1428);}
#celebrissio{background:radial-gradient(circle 438px at calc(100% - 190px) 190px,rgba(212,175,55,.22),transparent 65%),#0B0A0A;}
#skills4agent::before,#skills4agent::after,#celebrissio::before{content:none;}

#celebrissio .join h3{color:#F5F5F6;}
