/* SEPNOIR 20 / CHAPTERS • PRESENTATION • WORK INDEX. No external CSS requests. */
:root{--v20-ink:#1d1935;--v20-violet:#8063ed;--v20-soft:#ebe8fa;--v20-ease:cubic-bezier(.22,1,.36,1)}
.v20-chapter{position:relative;isolation:isolate;margin:clamp(42px,7vw,110px) auto;border-radius:clamp(24px,4vw,52px);overflow:hidden;background:radial-gradient(circle at 14% 13%,#393362 0%,transparent 39%),radial-gradient(circle at 87% 80%,#34244c 0%,transparent 42%),#171426;color:#f7f4ff;box-shadow:0 40px 100px rgba(25,14,55,.14)}
.v20-chapter:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 45%,rgba(255,255,255,.018) 50%,transparent 60%);opacity:.7}
.v20-chapter-inner{max-width:1280px;margin:auto;padding:clamp(32px,7vw,104px) clamp(24px,5.5vw,86px)}
.v20-kicker{display:inline-flex;align-items:center;gap:12px;font:650 .76rem/1.5 Inter,"Sepnoir Estedad",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#b9aaf2}
.v20-kicker:before{content:"";width:26px;height:1px;background:currentColor}
.v20-chapter-lead{max-width:980px;margin:clamp(27px,4vw,60px) 0 22px;font-size:clamp(2.8rem,7.7vw,8.2rem);font-weight:600;line-height:1.06;letter-spacing:-.055em}
html[lang=fa] .v20-chapter-lead{font-family:"Sepnoir Graphik","Sepnoir Estedad",sans-serif;letter-spacing:0;line-height:1.33;font-size:clamp(2.5rem,6.3vw,7.5rem)}
.v20-chapter-lead em{font-style:normal;color:#b2a1ff}
.v20-chapter-deck{max-width:620px;font-size:clamp(.96rem,1.5vw,1.15rem);line-height:2;color:#cac6dd;margin:0 0 clamp(34px,5vw,65px)}
.v20-process{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;align-items:stretch}
.v20-process-card{position:relative;min-width:0;min-height:clamp(270px,29vw,390px);border:1px solid rgba(238,232,255,.14);border-radius:24px;padding:clamp(20px,2.6vw,38px);background:rgba(255,255,255,.045);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:background .42s ease,border-color .42s ease,transform .6s var(--v20-ease)}
.v20-process-card:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;border:1px solid rgba(200,191,245,.1);inset-inline-end:-52px;top:40%;box-shadow:0 0 0 27px rgba(193,182,250,.025),0 0 0 62px rgba(193,182,250,.017);pointer-events:none}
.v20-process-card b{font:650 .8rem Inter,"Sepnoir Estedad",sans-serif;color:#c9bafa;letter-spacing:.08em}
.v20-process-card h3{font-size:clamp(1.6rem,2.9vw,3.25rem);line-height:1.4;margin:0 0 8px;font-weight:600}
.v20-process-card p{font-size:.9rem;line-height:1.9;color:#c5c2d4;max-width:350px;margin:0}
.v20-process-card:nth-child(2){background:linear-gradient(145deg,rgba(144,115,236,.21),rgba(255,255,255,.03))}
@media(hover:hover){.v20-process-card:hover{background:rgba(129,101,234,.16);border-color:rgba(206,193,255,.37);transform:translateY(-8px)}}
.v20-chapter-foot{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;margin-top:clamp(28px,4vw,48px)}
.v20-chapter-foot>a,.v20-all-work-link{display:inline-flex;align-items:center;gap:14px;border:1px solid rgba(224,216,250,.4);color:inherit;text-decoration:none;padding:13px 20px;border-radius:100px;font-weight:650;font-size:.92rem;transition:background .25s,transform .25s}
.v20-chapter-foot>a:hover{background:#fff;color:#1d1838;transform:translateY(-2px)}
.v20-chapter-foot small{color:#aaa1c1;font-family:Inter,"Sepnoir Estedad",sans-serif;letter-spacing:.15em}
.v20-section-end{display:flex;justify-content:center;margin:clamp(16px,3vw,38px) auto 0}
.v20-all-work-link{border-color:#b8ade3;color:#3a2c63;background:#f7f5fd}
.v20-all-work-link:hover{background:#211b3c;color:#fff}
.v20-scroll-reveal{opacity:1;transform:none}
@media(prefers-reduced-motion:no-preference){.v20-motion-active .v20-scroll-reveal{opacity:0;transform:translateY(28px);transition:opacity .85s var(--v20-ease),transform .85s var(--v20-ease)}.v20-motion-active .v20-scroll-reveal.is-visible{opacity:1;transform:none}.v20-motion-active .v20-scroll-reveal:nth-child(2){transition-delay:.09s}.v20-motion-active .v20-scroll-reveal:nth-child(3){transition-delay:.18s}}
@media(max-width:800px){.v20-process{grid-template-columns:1fr}.v20-process-card{min-height:235px}.v20-chapter{margin-inline:16px}.v20-chapter-lead{margin-top:26px}.v20-chapter-inner{padding:38px 22px}}
/* Work archive and project stories */
.v20-work-body{min-height:100vh;background:#f8f7fc;color:#211b3b;font-family:"Sepnoir Estedad",system-ui,sans-serif}
html[lang=en] .v20-work-body{font-family:Inter,system-ui,sans-serif}
.v20-work-body *{box-sizing:border-box}
.v20-nav{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px clamp(18px,5vw,80px);border-bottom:1px solid #e6e0ef;background:#fffdfcf0}
.v20-logo{font:800 clamp(1.3rem,2.4vw,2rem)/1 Inter,sans-serif;color:#221b3b;letter-spacing:-.06em;text-decoration:none;direction:ltr}
.v20-logo span{color:#8b6beb}.v20-nav-links{display:flex;gap:13px;flex-wrap:wrap}.v20-nav a:not(.v20-logo){display:inline-flex;align-items:center;min-height:42px;padding:8px 14px;border-radius:100px;color:#2d254a;font-weight:650;font-size:.87rem;text-decoration:none}
.v20-nav a:not(.v20-logo):hover{background:#efebfc}.v20-nav .v20-nav-primary{background:#261d44;color:#fff!important}
.v20-work-shell{width:min(100% - 36px,1260px);margin-inline:auto}
.v20-work-hero{position:relative;overflow:hidden;border-radius:0 0 36px 36px;padding:clamp(70px,11vw,150px) 0 clamp(60px,7vw,95px);background:radial-gradient(ellipse at 20% 10%,#58458b 0%,transparent 42%),radial-gradient(ellipse at 80% 100%,#3d294e 0%,transparent 42%),#171426;color:#fff}
.v20-work-hero h1{font-size:clamp(3.2rem,9vw,9.3rem);letter-spacing:-.07em;line-height:1.08;margin:21px 0 20px;font-weight:600}
html[lang=fa] .v20-work-hero h1{font-family:"Sepnoir Graphik","Sepnoir Estedad",sans-serif;letter-spacing:0;line-height:1.3;font-size:clamp(2.8rem,7.6vw,7.6rem)}
.v20-work-hero h1 em{color:#c0adff;font-style:normal}.v20-work-hero p{max-width:650px;line-height:2;font-size:1rem;color:#d1cadf}
.v20-work-index{padding:clamp(45px,7vw,95px) 0}.v20-title-row{display:flex;gap:18px;align-items:end;justify-content:space-between;flex-wrap:wrap;margin-bottom:28px}.v20-title-row h2{font-size:clamp(1.5rem,3vw,2.7rem);margin:0}.v20-title-row p{margin:0;color:#716985}
.v20-filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:28px}.v20-filter{border:1px solid #d9d2e8;background:white;color:#403554;border-radius:100px;padding:9px 18px;font:inherit;font-weight:700;cursor:pointer;min-height:42px}.v20-filter[aria-pressed=true]{background:#25203b;color:white;border-color:#25203b}
.v20-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.v20-card{background:#fff;border:1px solid #e4deed;overflow:hidden;border-radius:25px;transition:transform .45s var(--v20-ease),box-shadow .45s var(--v20-ease);text-decoration:none;color:inherit;display:block}
@media(hover:hover){.v20-card:hover{transform:translateY(-6px);box-shadow:0 20px 70px #27173817}}
.v20-card-media{display:block;aspect-ratio:1.52/1;overflow:hidden;background:linear-gradient(130deg,#e7e1fb,#ece9ed);position:relative}
.v20-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--v20-ease)}.v20-card:hover img{transform:scale(1.035)}
.v20-card-media.no-img{background:radial-gradient(circle at 76% 14%,#b5a1ec,transparent 50%),linear-gradient(135deg,#25213d,#494171)}
.v20-card-info{padding:clamp(20px,3vw,32px);display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.v20-card-info span{display:block;font-size:.78rem;opacity:.65;margin-bottom:8px}.v20-card-info h3{font-size:clamp(1.35rem,2.4vw,2rem);margin:0;font-weight:650}.v20-card-info p{font-size:.88rem;opacity:.68;line-height:1.75;max-width:480px;margin:8px 0 0}.v20-card-info b{display:grid;place-items:center;border-radius:14px;background:#29213f;color:white;min-width:47px;height:47px;font:22px Inter,sans-serif}
.v20-empty{padding:24px;border:1px dashed #c7b9dd;border-radius:19px;color:#786d8b;line-height:1.9}
.v20-case-hero{padding:clamp(64px,8vw,120px) 0;background:#181529;color:#fff}.v20-case-hero h1{font-size:clamp(2.5rem,7vw,6rem);line-height:1.24;max-width:900px;margin:30px 0 20px;font-weight:650}.v20-case-hero p{color:#d1cbdd;line-height:2;max-width:750px;font-size:1.12rem}.v20-case-cover{display:block;width:100%;border-radius:30px;max-height:680px;object-fit:cover;background:#ece5fa;margin-top:40px}.v20-case-details{padding:clamp(60px,8vw,100px) 0}.v20-case-details h2{font-size:clamp(2rem,4vw,3.5rem)}.v20-case-prose{line-height:2.3;white-space:pre-line;font-size:clamp(1rem,1.4vw,1.16rem);max-width:950px;color:#554d65}.v20-case-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:35px}.v20-case-gallery img{width:100%;border-radius:23px;object-fit:cover;min-height:180px}.v20-case-link{display:inline-flex;gap:12px;padding:15px 21px;border-radius:100px;background:#2a2144;color:white;text-decoration:none;margin-top:30px;font-weight:700}
.v20-bottom{margin-top:60px;padding:40px 24px;background:#1c182e;text-align:center;color:#dcd5ed;font-size:.85rem;line-height:1.8}.v20-bottom a{color:#c2b1ff}
@media(max-width:720px){.v20-card-grid,.v20-case-gallery{grid-template-columns:1fr}.v20-nav{padding:14px}.v20-nav-links{gap:4px}.v20-nav a:not(.v20-logo){font-size:.74rem;padding:7px 9px}.v20-card-info{padding:20px}.v20-work-hero{border-radius:0 0 22px 22px}.v20-case-cover{border-radius:16px}}
@media(prefers-reduced-motion:reduce){.v20-process-card,.v20-card,.v20-card img{transition:none!important;transform:none!important}}

/* V20.1 mobile QA: skip control only visible when keyboard-focused. */
.v20-work-body .v9-skip-link{position:absolute;top:0;inset-inline-start:12px;z-index:99;transform:translateY(-155%);background:#fff;color:#201836;padding:8px 14px;border:2px solid #8063ed;border-radius:8px}
.v20-work-body .v9-skip-link:focus-visible{transform:translateY(8px)}
@media(max-width:480px){.v20-nav{align-items:center;flex-wrap:wrap;row-gap:12px}.v20-nav .v20-logo{order:0;flex:1}.v20-nav-links{order:1;width:100%;justify-content:center}.v20-nav .v20-nav-primary{white-space:nowrap}.v20-work-shell{width:min(100% - 32px,1260px)}}