/* 7 dni jako tester: tokens and foundation from design-package.md (brand premise: zauważyć). */
:root{
  --canvas:#F3EEE6;--panel:#FBF8F3;--dusk:#1C2130;--dusk-panel:#262C3D;
  --accent:#2B45CF;--accent-hover:#2137AE;--accent-muted:rgba(43,69,207,.14);--accent-on-dusk:#8FA2FF;
  --lamp:#E8A35C;--text-primary:#1E1C19;--text-secondary:#5F584F;--text-on-dusk:#F3EEE6;--text-secondary-on-dusk:#A9A397;
  --line:#DCD3C5;--line-strong:#8E8577;
  --display:"Bricolage Grotesque",Georgia,serif;--body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gutter:clamp(18px,4vw,40px);--wrap:1180px;--r:18px;--r-lg:28px;
  --ease:cubic-bezier(.2,.7,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);
  --poster-static:url('../img/hero-mobile.jpg');
}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip;scroll-behavior:auto;-webkit-text-size-adjust:100%;background:var(--canvas)}
body{margin:0;overflow-x:hidden;overflow-x:clip;background:var(--canvas);color:var(--text-primary);font-family:var(--body);font-weight:400;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;opacity:0;animation:page-in .6s var(--ease) .05s forwards}
@keyframes page-in{to{opacity:1}}
img,video,svg{max-width:100%;display:block}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.02;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--accent);color:#fff;padding:10px 16px;border-radius:999px;font-weight:600;transition:top .2s}
.skip:focus{top:12px}
.wrap{width:min(var(--wrap),calc(100% - 2*var(--gutter)));margin:0 auto}
.wrap--narrow{width:min(860px,calc(100% - 2*var(--gutter)));margin:0 auto}
/* one fixed environment layer: lamp glow drift 70s + paper grain */
.env{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--canvas)}
.env::before{content:"";position:absolute;width:140vmax;height:140vmax;left:50%;top:40%;border-radius:50%;background:radial-gradient(closest-side,rgba(232,163,92,.09),rgba(232,163,92,0) 70%);transform:translate(-50%,-50%);animation:env-drift 70s linear -20s infinite}
.env::after{content:"";position:absolute;inset:0;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px 200px}
@keyframes env-drift{from{transform:translate(-50%,-50%) rotate(0) translateX(6vmax) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg) translateX(6vmax) rotate(-360deg)}}
/* type scale */
.eyebrow{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary);margin:0 0 18px;display:inline-flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:18px;height:1px;background:var(--line-strong)}
.h-display{font-size:clamp(40px,7.2vw,88px);line-height:.98;letter-spacing:-.03em}
.h2{font-size:clamp(32px,4.6vw,56px);max-width:18ch}
.h3{font-size:clamp(22px,2.4vw,30px);font-weight:600}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.55;color:var(--text-secondary);max-width:58ch}
.mono{font-family:var(--mono)}
.muted{color:var(--text-secondary)}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 26px;border-radius:999px;border:0;cursor:pointer;font-weight:600;font-size:17px;line-height:1.1;text-decoration:none;white-space:nowrap;transition:transform .25s var(--ease-out),box-shadow .35s var(--ease),background .25s}
.btn--accent{background:var(--accent);color:var(--panel);box-shadow:0 10px 28px -14px rgba(43,69,207,.6)}
.btn--accent:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 16px 34px -14px rgba(43,69,207,.7)}
.btn--ghost{background:transparent;color:var(--text-primary);border:1px solid var(--line-strong)}
.btn--ghost:hover{border-color:var(--text-primary)}
.btn--sm{padding:11px 18px;font-size:15px}
.btn--lg{padding:19px 34px;font-size:18px}
.btn--wide{width:100%;white-space:normal}
@media (pointer:coarse){.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}}
.textlink{background:none;border:0;padding:12px 4px;font-weight:500;color:var(--text-secondary);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-strong);cursor:pointer}
.textlink:hover{color:var(--text-primary)}
/* the signature: a hand-drawn ballpoint ring around a word */
.ring-word{position:relative;display:inline-block;white-space:nowrap}
.ring-word svg{position:absolute;left:-10%;top:-22%;width:120%;height:148%;overflow:visible;pointer-events:none}
.ring-word path{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:1000;transition:stroke-dashoffset 1.1s var(--ease)}
.in .ring-word path,.ring-word.on path,.drawn path{stroke-dashoffset:0}
/* layout primitives */
.section{padding:clamp(72px,11vw,140px) 0;position:relative}
.section--panel{background:var(--panel)}
.section--dusk{background:var(--dusk);color:var(--text-on-dusk)}
.section--dusk .eyebrow{color:var(--text-secondary-on-dusk)}
.section--dusk .lead,.section--dusk .muted{color:var(--text-secondary-on-dusk)}
.rule{height:1px;background:var(--line);margin:0}
/* entrances: container class prefixes, stagger retired after entry */
[data-in]{opacity:0;transform:translateY(22px);transition:opacity .75s var(--ease),transform .75s var(--ease)}
[data-in].in{opacity:1;transform:none}
.stagger>*{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.stagger.in>*{opacity:1;transform:none}
.stagger.in>*:nth-child(1){transition-delay:.05s}.stagger.in>*:nth-child(2){transition-delay:.15s}.stagger.in>*:nth-child(3){transition-delay:.25s}.stagger.in>*:nth-child(4){transition-delay:.35s}.stagger.in>*:nth-child(5){transition-delay:.45s}.stagger.in>*:nth-child(6){transition-delay:.55s}.stagger.in>*:nth-child(7){transition-delay:.65s}
.stagger.in.settled>*:nth-child(n){transition-delay:0s!important}
/* pause everything on hidden tab */
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}
/* reduced motion: final states, no drives */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  [data-in],.stagger>*{opacity:1!important;transform:none!important}
  .ring-word path{stroke-dashoffset:0!important}
  body{opacity:1}
}
html.rm [data-in],html.rm .stagger>*{opacity:1;transform:none;transition:none}
html.rm .ring-word path{stroke-dashoffset:0}
/* hidden always wins over display rules */
[hidden]{display:none!important}