/* آرمان — cobalt + lavender paper + peach. Alexandria display at poster size, Vazirmatn text. Type is the image. */
:root{--cobalt:#1F3BD6;--deep:#0E1330;--paper:#F1F0FB;--paper2:#E4E2F6;--peach:#FFB38A;--ink2:#4A4F72;--r:26px}
body{background:var(--paper);color:var(--deep);font:400 17px/1.95 "Vazirmatn",system-ui,sans-serif}
.asec{font:700 clamp(2rem,1.3rem + 2.6vw,3.4rem)/1.2 "Alexandria","Vazirmatn",sans-serif;margin:0 0 1.6rem;letter-spacing:0}
.asec--inv{color:#fff}
.abtn{display:inline-flex;align-items:center;padding:.85rem 1.5rem;border-radius:999px;background:var(--deep);color:#fff;text-decoration:none;font-weight:800;border:0;transition:transform .2s}
.abtn:hover{transform:translateY(-2px)}
.abtn--light{background:var(--peach);color:var(--deep)}

.progress{position:fixed;inset:0 0 auto;height:4px;z-index:30;background:transparent}
.progress i{display:block;height:100%;background:var(--peach);transform-origin:right;transform:scaleX(var(--p,0))}
@supports (animation-timeline:scroll()){
  .progress i{animation:grow linear both;animation-timeline:scroll(root)}
  @keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
}

.cursor{position:fixed;top:0;left:0;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:var(--peach);mix-blend-mode:multiply;pointer-events:none;z-index:50;transition:width .25s,height .25s,margin .25s,opacity .3s;opacity:0}
.cursor.is-on{opacity:1}.cursor.is-big{width:64px;height:64px;margin:-32px 0 0 -32px}
@media (hover:none){.cursor{display:none}}

.ah{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1.5rem;padding:1rem max(1.3rem,calc(50% - 600px));background:rgb(241 240 251/.85);backdrop-filter:blur(10px)}
.ah__logo{font:700 1.8rem/1 "Alexandria",sans-serif;color:var(--deep);text-decoration:none}
.ah__logo span,.af span span{color:var(--cobalt)}
.ah nav{display:flex;gap:1.3rem;margin-inline-start:auto}
.ah nav a{color:var(--ink2);font-weight:700;text-decoration:none}
.ah__cta{padding:.5rem 1.1rem;border-radius:999px;border:2px solid var(--deep);color:var(--deep);font-weight:800;text-decoration:none}
@media (max-width:720px){.ah nav{display:none}.ah__cta{margin-inline-start:auto}}

main{max-width:1200px;margin:auto;padding:0 1.3rem}
.ahero{padding:4rem 0 3rem;min-height:calc(100vh - 80px);display:flex;flex-direction:column;justify-content:center}
.ahero__k{margin:0 0 1rem;font-weight:800;color:var(--cobalt)}
.ahero__t{margin:0;font:700 clamp(3rem,1.2rem + 7.5vw,8.4rem)/1.08 "Alexandria",sans-serif;display:grid}
.ahero__t .l2{color:var(--cobalt);display:flex;gap:.25em;flex-wrap:wrap}
.l1,.l2,.l3{animation:in .9s cubic-bezier(.2,.8,.2,1) both}
.l2{animation-delay:.12s}.l3{animation-delay:.24s}
@keyframes in{from{opacity:0;transform:translateY(.4em)}}
.rot{position:relative;display:inline-grid;overflow:hidden;vertical-align:bottom}
.rot b{grid-area:1/1;justify-self:start;font-weight:700;transform:translateY(105%);opacity:0;transition:transform .6s cubic-bezier(.7,0,.2,1),opacity .6s;background:linear-gradient(transparent 62%,color-mix(in srgb,var(--peach) 75%,transparent) 0)}
.rot b.is-on{transform:none;opacity:1}
.rot b.is-out{transform:translateY(-105%);opacity:0}
.ahero__p{max-width:36rem;color:var(--ink2);font-size:1.15rem;margin:2rem 0 0}
.ahero__row{display:flex;align-items:center;gap:2rem;flex-wrap:wrap;margin-top:2rem}
.sig{width:220px;fill:none;stroke:var(--cobalt);stroke-width:3;stroke-linecap:round;stroke-dasharray:700;stroke-dashoffset:700;animation:sig 2.4s .8s ease forwards}
@keyframes sig{to{stroke-dashoffset:0}}

.statement{padding:5rem 0;border-top:2px solid var(--deep)}
.statement p{margin:0;font:700 clamp(1.6rem,1rem + 2.6vw,3.1rem)/1.6 "Alexandria",sans-serif;max-width:60rem}
.statement .w{opacity:.14;transition:opacity .4s}
.statement .w.is-lit{opacity:1}
@supports (animation-timeline:view()){
  .statement .w{transition:none;animation:lit linear both;animation-timeline:view();animation-range:cover 10% cover 45%}
  @keyframes lit{from{opacity:.14}to{opacity:1}}
}

.method{padding:4rem 0}
.method ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.method li{position:relative;padding:1.6rem;border-radius:var(--r);background:#fff;display:flex;flex-direction:column;gap:.4rem;min-height:300px}
.method li span{font:700 4.4rem/1 "Alexandria",sans-serif;color:var(--paper2)}
.method h3{margin:0;font:700 1.6rem/1.3 "Alexandria",sans-serif}
.method p{margin:0;color:var(--ink2)}
.method small{margin-top:auto;font-weight:800;color:var(--cobalt)}
@media (max-width:820px){.method ol{grid-template-columns:1fr}.method li{min-height:0}}

.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:3rem 0;border-block:2px solid var(--deep)}
.nums div{display:grid}
.nums b{font:700 clamp(3rem,2rem + 4vw,6rem)/1 "Alexandria",sans-serif;color:var(--cobalt)}
.nums span{color:var(--ink2);font-weight:700}
@media (max-width:640px){.nums{grid-template-columns:1fr}}

.voices{padding:4rem 0}
.vtrack{display:grid;grid-auto-flow:column;grid-auto-columns:min(80%,420px);gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem;scrollbar-width:thin}
.vtrack figure{scroll-snap-align:start;margin:0;padding:1.8rem;border-radius:var(--r);background:var(--deep);color:#fff;display:flex;flex-direction:column;justify-content:space-between;min-height:260px}
.vtrack figure:nth-child(2n){background:var(--cobalt)}
.vtrack blockquote{margin:0;font:700 1.45rem/1.6 "Alexandria",sans-serif}
.vtrack figcaption{color:#C8CCF5;font-weight:700;font-size:.9rem}

.plans{padding:3rem 0}
.pgrid{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:1rem;align-items:stretch}
.pgrid article{padding:1.6rem;border-radius:var(--r);border:2px solid var(--deep);display:flex;flex-direction:column;gap:.4rem}
.pgrid h3{margin:0;font:700 1.4rem/1.3 "Alexandria",sans-serif}
.pgrid .pr{margin:0;font:700 2.8rem/1.1 "Alexandria",sans-serif;color:var(--cobalt)}
.pgrid .pr small{font:700 .9rem "Vazirmatn",sans-serif;color:var(--ink2)}
.pgrid p{margin:0;color:var(--ink2)}
.pgrid .is-main{background:var(--peach);border-color:var(--peach)}
.pgrid .is-main .pr{color:var(--deep)}
@media (max-width:820px){.pgrid{grid-template-columns:1fr}}

.talk{margin:3rem 0 6rem;padding:clamp(1.5rem,4vw,3rem);border-radius:calc(var(--r) * 1.4);background:var(--cobalt);color:#E7E9FF;display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.talk p{color:#C8CCF5}
.talk form{display:grid;gap:.8rem}
.talk label:not(.pill){display:grid;gap:.2rem;font-weight:700;font-size:.9rem}
.talk input:not([type=radio]){padding:.75rem 1rem;border-radius:14px;border:0;background:rgb(255 255 255/.12);color:#fff;font-size:1rem}
.talk input::placeholder{color:#A9B0F0}
.talk input:focus{outline:2px solid var(--peach)}
.talk fieldset{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem}
.talk legend{font-weight:700;font-size:.9rem;margin-bottom:.4rem}
.pill{position:relative}
.pill input{position:absolute;opacity:0;inset:0;margin:0}
.pill span{display:inline-block;padding:.35rem .9rem;border-radius:999px;border:1.5px solid rgb(255 255 255/.4);font-weight:700;cursor:pointer}
.pill input:checked+span{background:#fff;color:var(--cobalt)}
.pill input:focus-visible+span{outline:2px solid var(--peach)}
.talk__ok{margin:0;padding:.8rem 1rem;border-radius:14px;background:#fff;color:var(--deep)!important;font-weight:700}
@media (max-width:820px){.talk{grid-template-columns:1fr}}
.af{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;max-width:1200px;margin:auto;padding:1.5rem 1.3rem 6rem;color:var(--ink2);font-size:.9rem;font-weight:700}