@font-face{font-family:"Proof Serif";src:url("/dupa-taietura/assets/NotoSerif.3f5b426d6eec.woff2") format("woff2");font-display:swap;font-weight:100 900;font-style:normal}
@font-face{font-family:"Proof Sans";src:url("/dupa-taietura/assets/NotoSans.59ac1c6375a8.woff2") format("woff2");font-display:swap;font-weight:100 900;font-style:normal}
@font-face{font-family:"Proof Mono";src:url("/dupa-taietura/assets/NotoMono.1140caed61b0.woff2") format("woff2");font-display:swap;font-weight:100 900;font-style:normal}

:root{
  --desk:#f7fbff;
  --paper:#ffffff;
  --trace:#e9f0f7;
  --carbon:#121b24;
  --carbon-2:#1d2a36;
  --ink:#18232e;
  --graphite:#667381;
  --pencil:#1f5bd8;
  --pencil-dark:#1745a2;
  --coral:#e64d5f;
  --rule:#c8d5e2;
  --serif:"Proof Serif",Georgia,serif;
  --sans:"Proof Sans",Arial,sans-serif;
  --mono:"Proof Mono","SFMono-Regular",monospace;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--desk);color:var(--ink)}
body{margin:0;background:radial-gradient(circle at 84% 14%,#d9e8ff 0,transparent 27rem),var(--desk);font-family:var(--sans);font-size:18px;line-height:1.55;overflow-x:hidden}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{color:var(--pencil)}
button{font:inherit}
::selection{background:#bdd2ff;color:var(--carbon)}
.skip-link{position:fixed;z-index:100;top:12px;left:12px;transform:translateY(-160%);padding:.7rem 1rem;background:var(--paper);border:2px solid var(--pencil);font-weight:700}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid var(--coral);outline-offset:4px}

.site-nav{width:min(1360px,calc(100% - 64px));margin:0 auto;padding:24px 0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(24,35,46,.18)}
.brand{font-family:var(--mono);font-size:.78rem;font-weight:700;letter-spacing:.06em;text-decoration:none;text-transform:uppercase}
.nav-links{display:flex;align-items:center;gap:28px;font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}
.nav-links a{text-decoration:none}
.nav-links a:last-child{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--ink);border-radius:50%;font-weight:800}

.hero{width:min(1360px,calc(100% - 64px));margin:0 auto;padding:clamp(64px,9vw,138px) 0 clamp(78px,10vw,140px);display:grid;grid-template-columns:repeat(12,1fr);gap:28px;position:relative}
.hero-title{grid-column:1/9}
.eyebrow,.section-label{margin:0 0 1.15rem;font-family:var(--mono);font-size:.72rem;line-height:1.35;letter-spacing:.11em;text-transform:uppercase;color:var(--pencil);font-weight:800}
.hero h1{margin:0;font-family:var(--serif);font-size:clamp(4.4rem,9.7vw,9.2rem);line-height:.84;letter-spacing:-.064em;font-weight:640;max-width:9ch}
.hero h1 em{display:block;color:var(--pencil);font-style:normal;text-indent:.72ch}
.hero-deck{grid-column:9/13;align-self:end;padding-bottom:.55rem}
.hero-deck>p:first-child{font-family:var(--serif);font-size:clamp(1.28rem,1.7vw,1.78rem);line-height:1.38;margin:0 0 1.5rem}
.trust-note{margin:0;padding-top:1rem;border-top:1px solid var(--rule);font-family:var(--mono);font-size:.72rem;line-height:1.55;color:var(--graphite)}
.hero-count{grid-column:10/13;position:absolute;right:0;top:clamp(38px,5vw,72px);display:grid;grid-template-columns:auto minmax(40px,1fr) auto;align-items:center;width:min(24vw,260px);gap:12px;font-family:var(--mono);color:var(--pencil)}
.hero-count span{font-size:clamp(1.4rem,2.5vw,2.5rem);font-weight:800}
.hero-count i{display:block;height:2px;background:currentColor;position:relative}
.hero-count i::after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border-top:2px solid;border-right:2px solid;transform:rotate(45deg)}
.hero-count small{grid-column:1/-1;text-align:right;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem;color:var(--graphite)}

.revision-section{background:var(--carbon);color:#f5f8fb;padding:clamp(76px,9vw,132px) max(32px,calc((100vw - 1360px)/2)) clamp(94px,11vw,160px);position:relative;overflow:hidden}
.revision-section::before{content:"";position:absolute;inset:0;background:linear-gradient(112deg,transparent 0 52%,rgba(112,159,210,.09) 52% 52.3%,transparent 52.3%);pointer-events:none}
.section-intro{position:relative;z-index:1;display:grid;grid-template-columns:2fr 1fr;gap:28px;align-items:end;margin-bottom:46px}
.section-intro h2{margin:0;font-family:var(--serif);font-size:clamp(2.35rem,5vw,5.1rem);line-height:.98;letter-spacing:-.045em;font-weight:610;max-width:14ch}
.section-intro>p:last-child{margin:0 0 .35rem;color:#aebdca;font-size:.92rem;max-width:42ch}
.revision-section .section-label{grid-column:1/-1;color:#9ebdff;margin-bottom:-.35rem}

.editor{position:relative;z-index:1;max-width:1120px;margin:0 auto}
.pass-controls{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin:0 0 24px;background:#40505e;border:1px solid #40505e}
.pass-button{min-height:78px;padding:12px 14px;background:var(--carbon-2);border:0;color:#afbdc9;text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;transition:background-color .18s ease,color .18s ease}
.pass-button:hover{background:#263848;color:#fff}
.pass-button[aria-pressed="true"]{background:var(--pencil);color:#fff}
.pass-button span{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em}
.pass-button strong{font-size:.83rem;line-height:1.15}

.paper-stage{position:relative;padding:26px 28px 0 0}
.paper-back{position:absolute;background:rgba(206,223,240,.2);border:1px solid rgba(220,235,250,.28);inset:8px 12px 18px 22px;transition:transform .35s ease}
.paper-back.back-two{inset:17px 4px 8px 35px;background:rgba(134,168,202,.13)}
.editor.pass-1 .paper-back:first-child{transform:translate(4px,5px) rotate(.15deg)}
.editor.pass-2 .paper-back:first-child{transform:translate(7px,8px) rotate(.3deg)}
.editor.pass-3 .paper-back:first-child{transform:translate(10px,11px) rotate(.45deg)}
.editor.pass-4 .paper-back:first-child{transform:translate(13px,14px) rotate(.6deg)}
.paper{position:relative;background:var(--paper);color:var(--ink);min-height:590px;box-shadow:0 34px 80px rgba(0,0,0,.34);display:flex;flex-direction:column}
.paper::before,.paper::after{content:"";position:absolute;width:24px;height:24px;border-color:#7d8c9b;pointer-events:none}
.paper::before{left:14px;top:14px;border-left:1px solid;border-top:1px solid}
.paper::after{right:14px;bottom:14px;border-right:1px solid;border-bottom:1px solid}
.paper-head{display:flex;justify-content:space-between;gap:20px;padding:25px 34px 18px 94px;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:.67rem;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite)}
.proof-grid{display:grid;grid-template-columns:70px minmax(0,1fr);flex:1}
.proof-rail{position:relative;border-right:1px solid var(--rule);background:linear-gradient(to bottom,transparent 0 27px,#dce5ee 28px);background-size:100% 28px}
.proof-rail::before{content:"";position:absolute;top:0;bottom:0;left:33px;border-left:1px solid rgba(230,77,95,.5)}
.pencil{position:absolute;left:12px;top:7%;width:78px;height:10px;background:var(--pencil);border-radius:2px 0 0 2px;box-shadow:0 2px 5px rgba(31,91,216,.28);transform:rotate(-24deg);transform-origin:18px 50%;transition:top .42s cubic-bezier(.2,.8,.2,1),transform .42s ease}
.pencil::before{content:"";position:absolute;right:-16px;top:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:16px solid #d9b78b}
.pencil::after{content:"";position:absolute;right:-17px;top:3px;border-top:2px solid transparent;border-bottom:2px solid transparent;border-left:6px solid #18232e}
.editor.pass-1 .pencil{top:25%;transform:rotate(-19deg)}
.editor.pass-2 .pencil{top:43%;transform:rotate(-15deg)}
.editor.pass-3 .pencil{top:61%;transform:rotate(-10deg)}
.editor.pass-4 .pencil{top:79%;transform:rotate(-5deg)}
.copy-window{padding:clamp(34px,5vw,66px) clamp(28px,6vw,82px) 36px;display:flex;flex-direction:column}
.pass-panel[hidden]{display:none}
.stage-action{margin:0 0 1.3rem;font-family:var(--mono);font-size:.72rem;line-height:1.4;letter-spacing:.06em;text-transform:uppercase;color:var(--pencil);font-weight:800}
.story{margin:0;font-family:var(--serif);font-size:clamp(1.65rem,3vw,2.75rem);line-height:1.42;letter-spacing:-.018em;text-wrap:pretty}
.editor-note{margin:auto 0 0;padding-top:34px;max-width:68ch;font-size:.92rem;color:#51606e;border-top:1px solid var(--rule)}
.note-label{display:block;margin-bottom:.55rem;font-family:var(--mono);font-size:.61rem;letter-spacing:.12em;text-transform:uppercase;color:var(--coral);font-weight:800}
.paper-foot{display:flex;justify-content:space-between;gap:24px;padding:17px 34px 19px 94px;border-top:1px solid var(--rule);font-family:var(--mono);font-size:.67rem;letter-spacing:.06em;text-transform:uppercase;color:var(--graphite)}
.paper-foot output{color:var(--pencil);font-weight:800}
.editor-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.no-script-final{margin:24px 0 0;padding:20px;border:2px solid var(--coral);background:#fff;color:var(--ink)}

.decisions{padding:clamp(92px,11vw,170px) max(32px,calc((100vw - 1360px)/2));background:var(--desk)}
.decisions .section-intro{color:var(--ink);margin-bottom:72px}
.decisions .section-intro>p:last-child{display:none}
.narrow h2{max-width:12ch}
.decision-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.decision-list li{display:grid;grid-template-columns:minmax(70px,1fr) 5fr 5fr;gap:28px;padding:38px 0;border-bottom:1px solid var(--rule);align-items:start}
.decision-number{font-family:var(--mono);font-size:.72rem;color:var(--pencil);font-weight:800;padding-top:.35rem}
.decision-list li>div{grid-column:2/4;display:grid;grid-template-columns:1fr 1fr;gap:28px}
.decision-list h3{margin:0;font-family:var(--serif);font-size:clamp(1.55rem,2.6vw,2.7rem);line-height:1.08;letter-spacing:-.03em;font-weight:600;max-width:16ch}
.decision-list p{margin:.25rem 0 0;color:#4d5b68;max-width:54ch}

.coda{background:var(--pencil);color:#fff;padding:clamp(92px,12vw,180px) max(32px,calc((100vw - 1120px)/2));position:relative;overflow:hidden}
.coda::before{content:"";position:absolute;width:34vw;height:34vw;min-width:300px;min-height:300px;right:-12vw;top:-12vw;border:1px solid rgba(255,255,255,.28);border-radius:50%}
.coda .section-label{color:#dbe6ff}
.coda h2{position:relative;margin:0 0 48px;font-family:var(--serif);font-size:clamp(3rem,7vw,7.2rem);line-height:.9;letter-spacing:-.055em;max-width:10ch;font-weight:620}
.coda blockquote{position:relative;margin:0 0 42px;padding:0 0 0 clamp(26px,4vw,54px);border-left:4px solid var(--coral);font-family:var(--serif);font-size:clamp(1.55rem,3.2vw,3rem);line-height:1.38;max-width:28ch}
.coda>p:last-child{position:relative;margin:0 0 0 auto;max-width:38ch;font-size:1.05rem;color:#e3ebff}

.method{margin:0;padding:clamp(72px,8vw,116px) max(32px,calc((100vw - 1120px)/2));background:#dfeaf5;color:var(--ink);display:grid;grid-template-columns:2fr 3fr;gap:28px}
.method .section-label{grid-column:1/-1;margin:0}
.method h2{margin:0;font-family:var(--serif);font-size:clamp(2rem,3.8vw,4rem);line-height:1.02;letter-spacing:-.04em;font-weight:610;max-width:13ch}
.method>p:last-child{margin:.25rem 0 0;max-width:55ch;color:#445463}
.method a{font-weight:700}
.site-footer{background:var(--carbon);color:#b8c5d0;padding:28px max(32px,calc((100vw - 1360px)/2));font-family:var(--mono);font-size:.67rem;letter-spacing:.04em}
.site-footer p{margin:0;display:flex;justify-content:space-between;gap:24px}
.site-footer a{color:#fff}

.error-page{min-height:100vh;display:grid;place-items:center;background:var(--carbon);color:#fff;padding:32px}
.error-page main{max-width:740px}
.error-page h1{font-family:var(--serif);font-size:clamp(3rem,8vw,7rem);line-height:.9;letter-spacing:-.05em;margin:0 0 24px}
.return-link{display:inline-block;margin-top:24px;padding:13px 18px;background:var(--pencil);color:#fff;text-decoration:none;font-weight:700}

@media(max-width:900px){
  .site-nav{width:min(100% - 36px,1360px);padding:16px 0}
  .nav-links{gap:12px}
  .nav-links a:not(:last-child){display:none}
  .hero{width:min(100% - 36px,1360px);padding:54px 0 72px;display:block}
  .hero-title{padding-top:32px}
  .hero h1{font-size:clamp(4rem,18vw,6.4rem);line-height:.86;max-width:8ch}
  .hero h1 em{text-indent:.35ch}
  .hero-deck{margin:42px 0 0;max-width:35rem}
  .hero-count{top:12px;width:160px}
  .hero-count span{font-size:1.25rem}
  .revision-section{padding:70px 18px 92px}
  .section-intro{display:block;margin-bottom:34px}
  .section-intro h2{font-size:clamp(2.45rem,12vw,4rem);max-width:12ch}
  .section-intro>p:last-child{margin-top:22px}
  .pass-controls{margin-bottom:16px}
  .pass-button{min-width:0;min-height:76px;padding:9px 6px;text-align:center;align-items:center}
  .pass-button strong{font-size:.69rem}
  .paper-stage{padding:14px 10px 0 0}
  .paper{min-height:660px}
  .paper-head{padding:20px 18px 15px 66px;font-size:.58rem}
  .proof-grid{grid-template-columns:48px minmax(0,1fr)}
  .proof-rail::before{left:23px}
  .pencil{left:4px;width:58px}
  .copy-window{padding:32px 22px 28px}
  .story{font-size:clamp(1.38rem,6.1vw,1.72rem);line-height:1.43}
  .editor-note{font-size:.8rem;padding-top:24px}
  .paper-foot{padding:14px 18px 16px 66px;font-size:.57rem}
  .decisions{padding:88px 18px}
  .decisions .section-intro{margin-bottom:52px}
  .decision-list li{grid-template-columns:38px 1fr;gap:14px;padding:30px 0}
  .decision-list li>div{grid-column:2;display:block}
  .decision-list h3{font-size:1.75rem}
  .decision-list p{margin-top:13px;font-size:.92rem}
  .coda{padding:88px 18px}
  .coda h2{font-size:clamp(3.2rem,15vw,5.4rem);margin-bottom:38px}
  .coda blockquote{font-size:1.6rem;padding-left:22px}
  .method{padding:72px 18px;display:block}
  .method h2{font-size:2.65rem;margin:18px 0 26px}
  .site-footer{padding:28px 18px}
  .site-footer p{display:block}
  .site-footer span{display:block;margin-top:8px}
}

@media(max-width:390px){
  body{font-size:17px}
  .hero h1{font-size:4rem}
  .pass-button{padding-inline:3px}
  .pass-button strong{font-size:.63rem}
  .paper{min-height:680px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
