/* enobo.pl - hero strony głównej: karta z symulacją odpowiedzi AI + podświetlenie tła za kursorem.
   Wkleić do bloku <style> strony głównej (wewnątrz .enobo-home-redesign) albo do osobnego arkusza.
   Wszystkie selektory mają prefiks .enobo-home-redesign i klasy eai-, żeby nie kolidowały z istniejącymi ehp-. */

/* --- warstwa podświetlenia tła w hero --- */
.enobo-home-redesign .ehp-hero{position:relative;overflow:hidden;isolation:isolate}
.enobo-home-redesign .eai-fx{position:absolute;inset:0;z-index:-1;pointer-events:none}
.enobo-home-redesign .eai-spot{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;
  background:radial-gradient(520px circle at var(--eai-mx,70%) var(--eai-my,30%),rgba(124,92,255,.20),transparent 62%)}
.enobo-home-redesign .eai-dots{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;
  background-image:radial-gradient(rgba(185,166,255,.55) 1px,transparent 1.2px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(260px circle at var(--eai-mx,70%) var(--eai-my,30%),#000,transparent 75%);
  mask-image:radial-gradient(260px circle at var(--eai-mx,70%) var(--eai-my,30%),#000,transparent 75%)}
.enobo-home-redesign .ehp-hero.eai-pointer .eai-spot,.enobo-home-redesign .ehp-hero.eai-pointer .eai-dots{opacity:1}

/* --- jednorazowy połysk na "za co płacisz." (tylko gdy JS włączy animacje) --- */
.enobo-home-redesign .ehp-hero.eai-motion .ehp-h1 em{
  background:linear-gradient(100deg,#b9a6ff 0%,#b9a6ff 40%,#ffffff 50%,#b9a6ff 60%,#b9a6ff 100%);
  background-size:250% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:eai-sheen 2.4s .5s cubic-bezier(.4,0,.2,1) both}
@keyframes eai-sheen{from{background-position:100% 0}to{background-position:0 0}}

/* --- karta --- */
.enobo-home-redesign .eai-stage{min-width:0}
.enobo-home-redesign .eai{position:relative;height:496px;border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.085),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 80px rgba(3,8,26,.55),inset 0 1px 0 rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#ffffff;font-family:"Poppins",sans-serif}
.enobo-home-redesign .eai:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:var(--eai-glare,0);transition:opacity .3s ease;
  background:radial-gradient(360px circle at var(--eai-gx,50%) var(--eai-gy,0%),rgba(255,255,255,.12),transparent 60%)}
.enobo-home-redesign .ehp-hero.eai-motion .eai{animation:eai-rise .9s .15s cubic-bezier(.2,.7,.2,1) both}
@keyframes eai-rise{from{opacity:.4;translate:0 18px}to{opacity:1;translate:0 0}}

.enobo-home-redesign .eai-top{display:flex;align-items:center;gap:8px}
.enobo-home-redesign .eai-tab{display:inline-flex;align-items:center;gap:8px;height:32px;margin:0;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);color:#cfd5ea;font-family:inherit;font-size:12px;font-weight:700;line-height:1;cursor:pointer;
  transition:background .25s ease,color .25s ease,border-color .25s ease}
.enobo-home-redesign .eai-tab i{width:8px;height:8px;border-radius:999px;background:var(--eai-c)}
.enobo-home-redesign .eai-tab.is-on{background:#ffffff;color:#172033;border-color:#ffffff;box-shadow:0 8px 20px rgba(7,17,45,.35)}
.enobo-home-redesign .eai-label{margin-left:auto;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#9aa3c0}

.enobo-home-redesign .eai-body{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;overflow:hidden}
.enobo-home-redesign .eai-q{align-self:flex-end;max-width:88%;min-height:44px;padding:11px 14px;border-radius:14px 14px 4px 14px;
  background:rgba(185,166,255,.16);border:1px solid rgba(185,166,255,.25);font-size:14px;line-height:1.45;color:#ffffff}
.enobo-home-redesign .eai.is-search .eai-q{position:relative;align-self:stretch;max-width:none;border-radius:999px;background:#ffffff;color:#172033;border:0;padding:11px 16px 11px 40px;font-weight:500}
.enobo-home-redesign .eai.is-search .eai-q:before{content:"";position:absolute;left:15px;top:50%;width:11px;height:11px;margin-top:-7px;border:2px solid #7a8199;border-radius:50%}
.enobo-home-redesign .eai.is-search .eai-q:after{content:"";position:absolute;left:25px;top:50%;width:6px;height:2px;margin-top:4px;background:#7a8199;transform:rotate(45deg)}
.enobo-home-redesign .eai-caret{display:inline-block;width:2px;height:1.05em;margin-left:2px;vertical-align:-2px;background:currentColor;animation:eai-blink 1s steps(1) infinite}
@keyframes eai-blink{50%{opacity:0}}

.enobo-home-redesign .eai-a{display:flex;flex-direction:column;gap:10px;min-height:0}
.enobo-home-redesign .eai-who{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#cfd5ea;opacity:0;transition:opacity .3s ease}
.enobo-home-redesign .eai-who.is-on{opacity:1}
.enobo-home-redesign .eai-who i{width:22px;height:22px;border-radius:7px;background:var(--eai-c);display:grid;place-items:center}
.enobo-home-redesign .eai-who i:after{content:"";width:8px;height:8px;border-radius:2px;background:#ffffff;transform:rotate(45deg)}
.enobo-home-redesign .eai-think{display:inline-flex;gap:4px;margin-left:4px}
.enobo-home-redesign .eai-think span{width:5px;height:5px;border-radius:50%;background:#cfd5ea;animation:eai-dot 1s infinite}
.enobo-home-redesign .eai-think span:nth-child(2){animation-delay:.15s}
.enobo-home-redesign .eai-think span:nth-child(3){animation-delay:.3s}
@keyframes eai-dot{0%,80%,100%{opacity:.25}40%{opacity:1}}
.enobo-home-redesign .eai-intro{margin:0;min-height:22px;font-size:14px;line-height:1.55;color:#d6dbeb}

.enobo-home-redesign .eai-list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.enobo-home-redesign .eai-item{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:center;margin:0;padding:9px 12px;border-radius:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);opacity:0;translate:0 8px;
  transition:opacity .35s ease,translate .35s ease,background .5s ease,border-color .5s ease,box-shadow .5s ease}
.enobo-home-redesign .eai-item.is-in{opacity:1;translate:0 0}
.enobo-home-redesign .eai-item b{display:block;font-size:13px;font-weight:700;line-height:1.3;color:#ffffff}
.enobo-home-redesign .eai-item div>span{display:block;font-size:12px;line-height:1.4;color:#9aa3c0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.enobo-home-redesign .eai-n{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-size:12px;font-weight:700;background:rgba(255,255,255,.08);color:#cfd5ea}
.enobo-home-redesign .eai-item.is-you.is-hit{background:linear-gradient(90deg,rgba(124,92,255,.32),rgba(124,92,255,.12));border-color:rgba(185,166,255,.75);
  box-shadow:0 0 0 3px rgba(124,92,255,.14),0 10px 26px rgba(86,59,209,.3)}
.enobo-home-redesign .eai-item.is-you.is-hit .eai-n{background:#6c52e7;color:#ffffff}
.enobo-home-redesign .eai-badge{display:inline-flex;align-items:center;gap:6px;height:22px;margin-top:7px;padding:0 9px;border-radius:999px;background:#ffffff;color:#563bd1;
  font-style:normal;font-size:11px;font-weight:700;box-shadow:0 8px 18px rgba(7,17,45,.4);opacity:0;scale:.6;transform-origin:left center;
  transition:opacity .3s ease,scale .45s cubic-bezier(.3,1.6,.5,1)}
.enobo-home-redesign .eai-badge:before{content:"";width:7px;height:4px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translate(1px,-1px)}
.enobo-home-redesign .is-hit .eai-badge{opacity:1;scale:1}

.enobo-home-redesign .eai-src{display:flex;flex-wrap:wrap;gap:6px;opacity:0;transition:opacity .4s ease}
.enobo-home-redesign .eai-src.is-in{opacity:1}
.enobo-home-redesign .eai-src span{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;font-size:11px;font-weight:600;color:#cfd5ea;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.enobo-home-redesign .eai-src span.is-you{color:#ffffff;border-color:rgba(185,166,255,.6);background:rgba(124,92,255,.22)}

.enobo-home-redesign .eai-foot{display:flex;gap:6px}
.enobo-home-redesign .eai-foot i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.enobo-home-redesign .eai-foot i:after{content:"";display:block;height:100%;width:var(--eai-p,0%);background:#a793ff;border-radius:inherit}

@media (max-width:767px){
  .enobo-home-redesign .eai{height:auto;min-height:532px;padding:14px}
  .enobo-home-redesign .eai-tab{height:30px;padding:0 9px;font-size:11px}
  .enobo-home-redesign .eai-label{display:none}
}
@media (prefers-reduced-motion:reduce){
  .enobo-home-redesign .eai-caret,.enobo-home-redesign .eai-think span{animation:none}
}

/* Interactive controls and a readable, static fallback share the same layout. */
.enobo-home-redesign .eai,
.enobo-home-redesign .eai * { letter-spacing: 0; }
.enobo-home-redesign .eai-top { min-width: 0; }
.enobo-home-redesign .eai-tabs { display: flex; flex: 1; flex-wrap: wrap; min-width: 0; gap: 8px; }
.enobo-home-redesign .eai-tab { flex: none; }
.enobo-home-redesign .eai-tab:disabled { opacity: 1; cursor: default; }
.enobo-home-redesign .eai-toggle { display: inline-grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 0; border: 1px solid rgba(255,255,255,.25); border-radius: 6px; background: rgba(255,255,255,.04); color: #fff; font-size: 14px; cursor: pointer; }
.enobo-home-redesign .eai-toggle[hidden] { display: none; }
.enobo-home-redesign .eai-toggle { visibility: hidden; }
.enobo-home-redesign .eai[data-eai-ready="1"] .eai-toggle { visibility: visible; }
.enobo-home-redesign .eai[data-eai-state="reduced"] .eai-toggle { visibility: hidden; }
.enobo-home-redesign .eai-toggle:hover { background: rgba(255,255,255,.14); }
.enobo-home-redesign .eai-tab:focus-visible,
.enobo-home-redesign .eai-toggle:focus-visible,
.enobo-home-redesign .eai-body:focus-visible { outline: 3px solid #c5b5ff; outline-offset: 3px; }
.enobo-home-redesign .eai-body { overflow: auto; scrollbar-width: thin; scrollbar-color: #b9a6ff transparent; }
.enobo-home-redesign .eai-copy-frame { display: block; position: relative; }
.enobo-home-redesign .eai-copy-size { display: block; visibility: hidden; }
.enobo-home-redesign .eai-copy-live { display: block; position: absolute; inset: 0; }
.enobo-home-redesign .eai-copy-live .eai-caret { position: relative; width: 0; margin-left: 0; background: none; }
.enobo-home-redesign .eai-copy-live .eai-caret:after { content: ""; position: absolute; width: 2px; height: 100%; background: currentColor; }
.enobo-home-redesign .eai-item div>span { color: #c6cde2; }
.enobo-home-redesign .eai-label { color: #c6cde2; }
.enobo-home-redesign .eai-bottom { display: flex; flex: none; align-items: center; gap: 10px; min-height: 16px; }
.enobo-home-redesign .eai-example-note { color: #c6cde2; font-size: 10px; font-weight: 600; line-height: 16px; text-transform: uppercase; }
.enobo-home-redesign .eai-foot { flex: 1; }
.enobo-home-redesign .eai-foot i.is-running:after { width: 100%; transform-origin: left center; animation: eai-progress var(--eai-cycle,10500ms) linear forwards; }
@keyframes eai-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (min-width:1200px) {
  .enobo-home-redesign .eai-bottom { min-height: 3px; }
  .enobo-home-redesign .eai-example-note { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (min-width:768px) and (max-width:1199px) {
  .enobo-home-redesign .eai { height: 560px; }
  .enobo-home-redesign .eai-label { display: none; }
}
@media (max-width:767px) {
  .enobo-home-redesign .ehp-hero { padding-bottom: 36px; }
  .enobo-home-redesign .eai { height: 552px; min-height: 552px; }
  .enobo-home-redesign .eai-tabs { gap: 6px; }
}
@media (max-width:359px) {
  .enobo-home-redesign .eai { height: 620px; min-height: 620px; padding: 12px; }
  .enobo-home-redesign .eai-top { gap: 6px; }
  .enobo-home-redesign .eai-tab { padding: 0 7px; gap: 5px; }
}
@media (prefers-reduced-motion:reduce) {
  .enobo-home-redesign .eai,
  .enobo-home-redesign .eai *,
  .enobo-home-redesign .eai:after { animation: none !important; transition: none !important; }
  .enobo-home-redesign .eai-spot,
  .enobo-home-redesign .eai-dots { display: none; }
}
