/* ════════════════════════════════════════════════════════════
   STUDIO MAKERS — Landing „Pierwsza godzina za 1 zł"
   Brand tokens from the shared Studio Makers design system.
   Display: Hanken Grotesk · Mono: JetBrains Mono
   ════════════════════════════════════════════════════════════ */

:root{
  --bg:#081417; --bg-deep:#050E10; --surface:#132124; --surface-2:#1B2C2F; --surface-3:#26383C;
  --line:rgba(239,235,255,.16); --line-soft:rgba(239,235,255,.08); --chip:rgba(255,255,255,.4);
  --text:#EFEFEF; --warm:#FFFFF2; --muted:#BFBFB6; --faint:#808B93; --ink:#0D2023;
  --acid:#DCFF00; --acid-warm:#EDED77; --acid-mute:rgba(220,255,0,.15); --leaf:#9AC2C5; --leaf-deep:#5C8F92;
  --r-pill:100px; --r-card:40px; --r-card-sm:28px; --r-md:22px; --r-sm:16px; --r-xs:12px;
  --font:"Hanken Grotesk","Aeonik TRIAL",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --wrap:1200px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--font);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.5;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.ital{font-style:italic}
.acid{color:var(--acid)}
.uline{position:relative;white-space:nowrap;font-style:italic;color:var(--warm)}
.uline::after{content:"";position:absolute;left:-1%;right:-1%;bottom:.02em;height:.11em;
  background:var(--acid);border-radius:100px}

/* ── type scale ── */
.h-sec{font-weight:600;line-height:1.06;letter-spacing:-.025em;color:var(--warm)}
.h-lg{font-size:clamp(34px,4.6vw,60px)}
.h-md{font-size:clamp(28px,3.4vw,44px)}
.lead{font-size:clamp(16px,1.4vw,20px);line-height:1.55;color:var(--muted);font-weight:400}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--acid)}
.eyebrow::before{content:"⁕";font-size:14px;line-height:1}
.micro{font-size:13.5px;color:var(--faint);line-height:1.55}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;
  border-radius:var(--r-pill);border:1.5px solid transparent;font-family:var(--font);font-weight:700;
  font-size:16px;letter-spacing:-.01em;cursor:pointer;white-space:nowrap;
  transition:transform .18s var(--ease),background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease)}
.btn svg{width:18px;height:18px}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--acid);color:var(--ink);box-shadow:0 12px 34px -12px rgba(220,255,0,.55)}
.btn--primary:hover{background:#E8FF3F;transform:translateY(-2px);box-shadow:0 18px 44px -12px rgba(220,255,0,.7)}
.btn--ghost{background:transparent;color:var(--text);border-color:var(--chip)}
.btn--ghost:hover{background:rgba(255,255,255,.06);border-color:var(--text)}
.btn--ink{background:var(--text);color:var(--ink)}
.btn--ink:hover{background:#fff;transform:translateY(-2px)}
.btn--sm{height:42px;padding:0 20px;font-size:15px}
.btn--lg{height:58px;padding:0 30px;font-size:17px}
.btn--full{width:100%}

/* ════ campaign bar ════ */
.cbar{position:relative;background:var(--acid);color:var(--ink);z-index:60}
.cbar__inner{display:flex;align-items:center;justify-content:center;gap:18px;padding:11px 48px 11px 28px;flex-wrap:wrap}
.cbar__txt{font-size:14.5px;font-weight:500}
.cbar__txt s{opacity:.55}
.cbar__btn{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:14px;
  border:1.5px solid var(--ink);border-radius:var(--r-pill);padding:6px 15px;transition:.18s var(--ease)}
.cbar__btn:hover{background:var(--ink);color:var(--acid)}
.cbar__btn svg{width:13px;height:13px}
.cbar__close{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:none;
  color:var(--ink);cursor:pointer;opacity:.7;display:flex}
.cbar__close:hover{opacity:1}
.cbar.hide{display:none}

/* ════ header ════ */
.hdr{position:sticky;top:0;z-index:50;background:rgba(8,20,23,.72);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line-soft);transition:background .3s var(--ease)}
.hdr.scrolled{background:rgba(6,14,16,.92)}
.hdr__inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
.hdr__left{display:flex;align-items:center;gap:38px}
.hdr__logo img{height:30px;width:auto}
.hdr__nav{display:flex;gap:28px}
.hdr__nav a{font-size:15px;color:var(--muted);font-weight:500;transition:color .15s;position:relative;padding:4px 0}
.hdr__nav a:hover{color:var(--text)}
.hdr__cta{display:flex;align-items:center;gap:12px}
.hdr__burger{display:none;background:none;border:none;color:var(--text);cursor:pointer}

/* ════ section rhythm ════ */
.section{padding:clamp(64px,8vw,104px) 0;position:relative}
.section--deep{background:var(--bg-deep)}
.sec-head{max-width:780px;margin-bottom:48px}
.sec-head .eyebrow{margin-bottom:18px}
.sec-head .lead{margin-top:18px}

/* ════ HERO ════ */
.hero{position:relative;padding:clamp(48px,6vw,84px) 0 clamp(48px,6vw,84px);overflow:hidden}
.hero__glow{position:absolute;inset:0;pointer-events:none}
.hero__glow::before{content:"";position:absolute;width:1100px;height:720px;top:-300px;right:-200px;
  background:radial-gradient(circle,rgba(220,255,0,.12),transparent 62%);filter:blur(50px)}
.hero__glow::after{content:"";position:absolute;width:840px;height:580px;bottom:-280px;left:-240px;
  background:radial-gradient(circle,rgba(90,143,146,.22),transparent 65%);filter:blur(70px)}
.hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero__tag{margin-bottom:22px}
.hero__h1{font-size:clamp(38px,5.6vw,72px);font-weight:600;line-height:1.03;letter-spacing:-.03em;
  color:var(--warm);max-width:14ch}
.hero__lead{margin-top:24px;max-width:54ch;font-size:clamp(16px,1.4vw,20px);line-height:1.55;color:var(--muted)}
.hero__lead b{color:var(--text);font-weight:600}
.hero__lead .price{color:var(--acid);font-weight:700;white-space:nowrap}
.hero__ctas{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.hero__micro{margin-top:16px;font-size:13.5px;color:var(--faint)}
.hero__pills{list-style:none;margin-top:30px;display:flex;flex-direction:column;gap:12px}
.hero__pills li{display:flex;align-items:center;gap:11px;font-size:15px;color:var(--text)}
.hero__pills svg{width:18px;height:18px;flex:none;color:var(--acid);
  background:var(--acid-mute);border-radius:50%;padding:3px}

/* ── offer card ── */
.offer{position:relative}
.offer__card{position:relative;background:linear-gradient(180deg,var(--surface),var(--bg-deep));
  border:1px solid var(--line);border-radius:var(--r-card);padding:32px;
  box-shadow:0 40px 90px -40px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.05)}
.offer__card::before{content:"";position:absolute;inset:-1px;border-radius:var(--r-card);padding:1px;
  background:linear-gradient(140deg,rgba(220,255,0,.6),transparent 38%,transparent 62%,rgba(90,143,146,.5));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.offer__row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.offer__label{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.offer__badge{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--ink);background:var(--acid);
  padding:4px 10px;border-radius:var(--r-pill)}
.offer__prices{display:flex;align-items:baseline;gap:18px;margin:18px 0 24px}
.offer__was{font-size:30px;color:var(--faint);text-decoration-thickness:2px;text-decoration-color:var(--leaf-deep)}
.offer__now{font-size:clamp(64px,9vw,88px);font-weight:700;line-height:.9;letter-spacing:-.04em;color:var(--warm)}
.offer__net{font-size:18px;font-weight:500;color:var(--faint);margin-left:8px;letter-spacing:0}
.offer__feat{margin-top:22px;display:flex;flex-direction:column;gap:11px;
  border-top:1px solid var(--line-soft);padding-top:20px}
.offer__feat div{font-size:14.5px;color:var(--muted)}
.offer__feat b{color:var(--text);font-weight:600}
.offer__fine{margin-top:18px;font-size:12px;line-height:1.5;color:var(--faint)}

/* ════ logos ════ */
.logos{padding:34px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.logos__inner{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.logos__label{font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);flex:none}
.logos__row{display:flex;align-items:center;gap:36px;flex-wrap:wrap;opacity:.78}
.logos__row img{height:24px;width:auto;filter:grayscale(1) brightness(1.7);opacity:.8}
.logo-wm{font-weight:700;font-size:17px;letter-spacing:-.01em;color:var(--muted);white-space:nowrap}
.logo-wm i{font-style:normal;color:var(--acid);font-weight:800;margin-left:2px}

/* ════ why 1 zł ════ */
.why__inner{max-width:920px}
.why__h{margin-top:16px}
.why__cols{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:30px}
.why__cols p{font-size:clamp(16px,1.4vw,18.5px);line-height:1.6;color:var(--muted)}
.why__cols b{color:var(--warm);font-weight:600}

/* ════ steps ════ */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-card-sm);
  padding:30px 28px 32px;position:relative;overflow:hidden;transition:border-color .25s var(--ease),transform .25s var(--ease)}
.step:hover{border-color:var(--line);transform:translateY(-4px)}
.step__n{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--acid);
  display:inline-block;border:1px solid var(--acid-mute);border-radius:var(--r-pill);padding:5px 13px}
.step__t{margin-top:22px;font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--warm)}
.step__d{margin-top:12px;font-size:15px;line-height:1.6;color:var(--muted)}

/* ════ arrangements ════ */
.arr{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.arr__tile{position:relative;border-radius:var(--r-card-sm);overflow:hidden;grid-column:span 2;
  aspect-ratio:4/3;border:1px solid var(--line-soft)}
.arr__tile--big{grid-column:span 3}
.arr__tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.arr__tile:hover img{transform:scale(1.05)}
.arr__tile figcaption{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  padding:22px;gap:6px;background:linear-gradient(180deg,transparent 32%,rgba(5,14,16,.5) 62%,rgba(5,14,16,.92))}
.arr__name{font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.16em;color:var(--acid)}
.arr__for{font-size:14px;line-height:1.45;color:var(--warm);max-width:34ch}
.arr__note{margin-top:20px}

/* ════ videos ════ */
.videos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vid{display:flex;flex-direction:column;gap:14px}
.vid__frame{position:relative;aspect-ratio:16/9;border-radius:var(--r-card-sm);overflow:hidden;
  border:1px solid var(--line-soft);background:var(--surface);box-shadow:0 24px 60px -30px rgba(0,0,0,.7)}
.vid__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid figcaption{font-size:14.5px;line-height:1.45;color:var(--muted);font-weight:500}

/* ════ proof ════ */
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcard{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-card-sm);
  padding:30px 28px;display:flex;flex-direction:column;gap:14px;transition:border-color .25s,transform .25s}
.pcard:hover{border-color:var(--line);transform:translateY(-4px)}
.pcard__num{font-size:clamp(34px,3.6vw,44px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--warm);
  display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}
.pcard__num span{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--acid)}
.pcard__d{font-size:15px;line-height:1.6;color:var(--muted);flex:1}
.pcard__who{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--faint);
  border-top:1px solid var(--line-soft);padding-top:14px}
.proof__trust{margin-top:30px;max-width:80ch;font-size:clamp(15px,1.3vw,17px);line-height:1.6;color:var(--muted)}
.proof__trust b{color:var(--warm);font-weight:600}

/* ════ FAQ ════ */
.faq__wrap{max-width:880px}
.faq{display:flex;flex-direction:column;gap:12px}
.faq__item{background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r-md);overflow:hidden;
  transition:border-color .2s}
.faq__item.open{border-color:var(--line)}
.faq__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:22px 26px;background:none;border:none;cursor:pointer;text-align:left;
  font-family:var(--font);font-size:clamp(16px,1.5vw,18.5px);font-weight:600;color:var(--warm);letter-spacing:-.01em}
.faq__ic{position:relative;flex:none;width:18px;height:18px}
.faq__ic::before,.faq__ic::after{content:"";position:absolute;background:var(--acid);border-radius:2px;
  transition:transform .25s var(--ease)}
.faq__ic::before{top:8px;left:0;width:18px;height:2px}
.faq__ic::after{top:0;left:8px;width:2px;height:18px}
.faq__item.open .faq__ic::after{transform:scaleY(0)}
.faq__a{max-height:0;overflow:hidden;transition:max-height .32s var(--ease)}
.faq__a-inner{padding:0 26px 24px;font-size:15.5px;line-height:1.62;color:var(--muted)}
.faq__a-inner b{color:var(--text);font-weight:600}

/* ════ booking ════ */
.book{position:relative;overflow:hidden}
.book::before{content:"";position:absolute;width:900px;height:600px;top:-220px;right:-180px;
  background:radial-gradient(circle,rgba(220,255,0,.10),transparent 62%);filter:blur(60px);pointer-events:none}
.book__grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.book__h{margin-top:16px}
.book__copy .lead{margin-top:20px;max-width:48ch}
.book__list{list-style:none;margin-top:26px;display:flex;flex-direction:column;gap:14px}
.book__list li{display:flex;align-items:flex-start;gap:11px;font-size:15.5px;color:var(--text);line-height:1.45}
.book__list b{color:var(--warm);font-weight:600}
.book__list a{color:var(--acid);font-weight:600}
.book__list svg{width:18px;height:18px;flex:none;color:var(--acid);background:var(--acid-mute);border-radius:50%;padding:3px;margin-top:1px}
.book__fine{margin-top:24px;font-size:12px;line-height:1.5;color:var(--faint);max-width:54ch}
.book__widget{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);
  padding:10px;box-shadow:0 40px 90px -40px rgba(0,0,0,.7)}
.book__widget .calendly-inline-widget{border-radius:var(--r-card-sm);overflow:hidden}

/* ════ footer ════ */
.ft{border-top:1px solid var(--line-soft);padding:64px 0 40px;background:var(--bg-deep)}
.ft__inner{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px}
.ft__brand img{height:30px;margin-bottom:18px}
.ft__brand p{font-size:14px;line-height:1.7;color:var(--faint)}
.ft__brand strong{color:var(--text);text-transform:lowercase;font-weight:700}
.ft h4{font-size:12px;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
.ft ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.ft ul a{font-size:14.5px;color:var(--muted);transition:color .15s}
.ft ul a:hover{color:var(--text)}
.ft__bottom{margin-top:48px;padding-top:24px;border-top:1px solid var(--line-soft);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--faint)}

/* ════ sticky mobile CTA ════ */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:55;padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:linear-gradient(0deg,var(--bg) 60%,transparent);display:none}

/* ════ reveal ════ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ════ responsive ════ */
@media(max-width:980px){
  .hero__grid{grid-template-columns:1fr;gap:40px}
  .hero__h1{max-width:100%}
  .offer{max-width:440px}
  .steps{grid-template-columns:1fr}
  .arr{grid-template-columns:repeat(2,1fr)}
  .arr__tile,.arr__tile--big{grid-column:span 1}
  .proof{grid-template-columns:1fr}
  .videos{grid-template-columns:1fr;max-width:560px;margin:0 auto}
  .why__cols{grid-template-columns:1fr;gap:18px}
  .book__grid{grid-template-columns:1fr;gap:34px}
  .ft__inner{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:720px){
  .hdr__nav,.hdr__cta .btn--ghost{display:none}
  .hdr__burger{display:flex}
  .hdr.menu-open .hdr__nav{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;
    gap:0;background:var(--bg-deep);border-bottom:1px solid var(--line);padding:8px 28px}
  .hdr.menu-open .hdr__nav a{padding:14px 0;border-bottom:1px solid var(--line-soft)}
  .mcta{display:block}
  body{padding-bottom:76px}
  .arr{grid-template-columns:1fr}
  .ft__inner{grid-template-columns:1fr}
  .ft__bottom{flex-direction:column;gap:6px}
  .cbar__inner{padding:10px 40px 10px 16px;gap:10px}
}