/* pages/home.css — بخشی از سیستم سبک سایت عمومی پلاس */
.hero-stage{position:relative;block-size:230vh}
@media(max-width:820px){
.hero-stage{block-size:200vh}
}
.hero{position:sticky;inset-block-start:0;block-size:100vh;min-block-size:640px;display:flex;flex-direction:column;overflow:hidden;
  padding-block-start:calc(var(--nav-height) + clamp(20px,6vh,70px));padding-block-end:0}
canvas#net{position:absolute;inset:0;inline-size:100%;block-size:100%;display:block}
.aurora{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(52% 42% at 22% 30%,rgba(34,211,238,.075),transparent 70%),
  radial-gradient(40% 34% at 30% 78%,rgba(16,185,129,.05),transparent 70%),
  radial-gradient(46% 40% at 82% 12%,rgba(37,99,235,.06),transparent 70%)}
.hero .veil{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(to bottom,rgba(5,7,15,.72),transparent 24%,transparent 66%,rgba(5,7,15,.94))}
.grain{position:absolute;inset:0;pointer-events:none;opacity:.04;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero .wrap{position:relative;z-index:3;flex:1;display:flex;align-items:center;inline-size:100%}
.hero-copy{max-inline-size:640px;pointer-events:none;will-change:transform,opacity}
.hero-copy2{position:absolute;z-index:3;inset-inline-end:var(--gutter);inset-block-start:50%;
  transform:translateY(-40%);max-inline-size:470px;opacity:0;visibility:hidden;text-align:start;will-change:transform,opacity}
.hero-copy2 h2{font-family:var(--font-display);font-weight:900;font-size:clamp(28px,3.4vw,50px);line-height:1.55;
  text-shadow:0 24px 80px rgba(0,0,0,.7);text-wrap:balance}
.hero-copy2 .lede{margin-block-start:16px}
.hero-copy2 .btn{margin-block-start:28px}
@media(max-width:900px){
.hero-copy2{inset-inline:var(--gutter);max-inline-size:none;text-align:center}
}
.hero-copy a,.hero-copy form,.hero-copy button{pointer-events:auto}
h1 .soft{display:block;font-size:.52em;font-weight:800;color:#C6D4EC;margin-block-start:.35em;letter-spacing:0}
.brands{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,26px)}
@media(max-width:820px){
.brands{grid-template-columns:1fr}
}
.brand-p{position:relative;border-radius:26px;padding:clamp(28px,3.4vw,46px);overflow:hidden;
  background:var(--bg-elev);border:1px solid var(--line);
  transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base),border-color var(--dur-base)}
.brand-p:hover{transform:translateY(-6px);box-shadow:0 34px 70px -32px rgba(11,18,38,.35);
  border-color:color-mix(in oklab,var(--accent) 40%,transparent)}
.brand-p::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.85;
  background:radial-gradient(90% 120% at 85% -10%,color-mix(in oklab,var(--accent) 13%,transparent),transparent 60%)}
.brand-p .top{display:flex;align-items:center;gap:14px;margin-block-end:18px}
.brand-p .top svg{inline-size:46px;block-size:46px;color:var(--accent)}
.brand-p .top b{font-family:var(--font-display);font-size:clamp(20px,2vw,26px);font-weight:900;display:block;color:var(--fg)}
.brand-p .top span{font-size:12.5px;color:var(--fg-muted)}
.brand-p p{font-size:14px;line-height:2.15;color:var(--fg-muted);max-inline-size:400px;text-wrap:pretty}
.brand-p .row{display:flex;align-items:center;gap:22px;margin-block-start:22px;padding-block-start:20px;border-block-start:1px solid var(--line)}
.brand-p .row div b{display:block;font-family:var(--font-display);font-size:20px;font-weight:900;color:var(--accent)}
.brand-p .row div span{font-size:11.5px;color:var(--fg-muted)}
.brand-p .row .go{margin-inline-start:auto;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;
  color:var(--accent);text-decoration:none}
.brand-p .row .go svg{inline-size:15px;block-size:15px;transition:transform var(--dur-fast) var(--ease-out)}
.brand-p:hover .row .go svg{transform:translateX(-4px)}
/* کارت برند «به‌زودی» — برندی که در پنل غیرفعال شده است.
   همان جعبه کارت برند می‌ماند ولی کوچک‌تر، بی‌حرکت و بدون هیچ لینکی؛
   نه ردیف شمارها دارد و نه دکمه ورود. تنها چیزی که این کلاس را می‌آورد
   غیرفعال بودن رکورد ساب‌برند است، پس هیچ برندی اینجا نام‌گذاری نمی‌شود. */
.brand-p.soon{padding:clamp(18px,2vw,26px);align-self:start}
.brand-p.soon::before{opacity:.3}
.brand-p.soon:hover{transform:none;box-shadow:none;border-color:var(--line)}
.brand-p.soon .top{margin-block-end:0;gap:11px}
.brand-p.soon .top img,.brand-p.soon .top svg{inline-size:34px;block-size:34px}
.brand-p.soon .top b{font-size:clamp(16px,1.5vw,19px)}
.soon-chip{display:inline-flex;align-items:center;gap:7px;margin-block-start:14px;padding:4px 12px;
  border-radius:var(--chip-radius);border:1px dashed var(--line-strong);
  color:var(--fg-muted);font-size:12px;font-weight:700}
.soon-chip i{inline-size:6px;block-size:6px;border-radius:50%;background:currentColor;opacity:.65}
.up .bar{display:block}
.teachers{display:grid;grid-template-columns:repeat(auto-fit,minmax(206px,1fr));gap:clamp(14px,1.8vw,22px)}
.upcoming{display:flex;flex-direction:column;gap:clamp(10px,1.2vw,14px)}
.up{--u-c:var(--brand-modir);display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(14px,2vw,28px);padding:clamp(13px,1.5vw,18px);border-radius:20px;
  border:1px solid var(--line);background:var(--bg-elev);
  transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base),border-color var(--dur-base)}
.up.ravan{--u-c:var(--brand-ravan)}
.up:hover{transform:translateY(-4px);border-color:color-mix(in oklab,var(--u-c) 44%,transparent);
  box-shadow:0 26px 54px -30px rgba(11,18,38,.34)}
.up .d{inline-size:clamp(62px,7vw,78px);aspect-ratio:1/1;border-radius:16px;display:grid;place-items:center;
  align-content:center;gap:2px;text-align:center;flex:none;
  background:color-mix(in oklab,var(--u-c) 11%,transparent);
  border:1px solid color-mix(in oklab,var(--u-c) 26%,transparent)}
.up .d b{font-family:var(--font-display);font-size:clamp(20px,2.2vw,26px);font-weight:900;line-height:1;
  color:color-mix(in oklab,var(--u-c) 82%,var(--fg))}
.up .d span{font-size:10.5px;color:var(--fg-muted)}
.up .b .chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-block-end:9px}
.up .b h3{font-family:var(--font-display);font-size:clamp(15px,1.6vw,18px);font-weight:800;line-height:1.7}
.up .b .m{display:flex;gap:16px;flex-wrap:wrap;margin-block-start:10px;font-size:11.5px;color:var(--fg-muted)}
.up .b .m span{display:flex;align-items:center;gap:6px}
.up .b .m svg{inline-size:13px;block-size:13px;opacity:.75}
.up .r{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-inline-size:150px}
.up .cap{inline-size:100%;font-size:11px;color:var(--fg-muted)}
.up .bar{inline-size:100%;block-size:5px;border-radius:99px;background:color-mix(in oklab,var(--fg) 9%,transparent);
  overflow:hidden;margin-block-start:7px}
.up .bar i{display:block;block-size:100%;border-radius:99px;background:var(--u-c)}
.up .bar.hot i{background:var(--gold-400)}
@media(max-width:860px){
.up{grid-template-columns:auto 1fr;row-gap:16px}
.up .r{grid-column:1/-1;min-inline-size:0}
}
.life{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(172px,1fr);gap:clamp(10px,1.2vw,14px)}
.life a{position:relative;display:block;overflow:hidden;border-radius:20px;text-decoration:none;color:#fff;
  min-block-size:148px;isolation:isolate;
  transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base)}
.life a:hover{transform:translateY(-5px);box-shadow:0 30px 62px -32px rgba(11,18,38,.45)}
.life a:nth-child(1){grid-column:span 2;grid-row:span 2}
@media(max-width:900px){
.life{grid-template-columns:repeat(2,1fr)}
.life a:nth-child(1){grid-column:span 2;grid-row:span 1}
.life a:nth-child(4){grid-column:span 2}
}
.life .art{position:absolute;inset:0;z-index:-1;
  background:radial-gradient(120% 130% at 22% 8%,var(--a1),transparent 62%),
             radial-gradient(110% 120% at 88% 96%,var(--a2),transparent 60%),
             linear-gradient(150deg,var(--navy-800),var(--navy-950))}
.life .art::after{content:"";position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.15) 1px,transparent 1.5px);background-size:24px 24px}
.life a::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(5,7,15,.88),rgba(5,7,15,.12) 52%,transparent);
  transition:opacity var(--dur-base)}
.life a:hover::after{opacity:.82}
.life .cap{position:absolute;z-index:1;inset-block-end:0;inset-inline:0;padding:clamp(14px,1.6vw,20px)}
.life .cap b{display:block;font-family:var(--font-display);font-size:15px;font-weight:800;text-shadow:0 6px 24px rgba(0,0,0,.6)}
.life a:nth-child(1) .cap b{font-size:clamp(17px,2vw,22px)}
.life .cap span{display:block;margin-block-start:6px;font-size:11.5px;color:#B9CAE4}
.life .more{display:flex;align-items:center;justify-content:center;gap:10px;flex-direction:column;
  border:1px dashed var(--line-strong);background:transparent;color:var(--fg)}
.life .more::after{display:none}
.life .more .art{display:none}
.life .more b{font-family:var(--font-display);font-size:14.5px;font-weight:800}
.life .more span{font-size:11.5px;color:var(--fg-muted)}
.life .more svg{inline-size:22px;block-size:22px;color:var(--teal-600)}
.life .more:hover{border-color:var(--teal-600)}
.faq{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(26px,4vw,64px);align-items:start}
@media(max-width:900px){
.faq{grid-template-columns:1fr}
}
.faq-side{position:sticky;inset-block-start:calc(var(--nav-height) + 24px)}
@media(max-width:900px){
.faq-side{position:static}
}
.faq-side p{margin-block-start:16px;font-size:13.5px;line-height:2.15;color:var(--fg-muted);max-inline-size:330px}
.faq-side .btn{margin-block-start:24px}
.mods{display:flex;flex-direction:column;gap:10px}
.fac-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;
  margin-block-end:clamp(26px,3.4vw,44px)}
.fac-hubs{display:flex;gap:12px;flex-wrap:wrap}
.fac-hub{--h-c:var(--brand-modir-soft);display:inline-flex;align-items:center;gap:10px;cursor:default;
  font-family:var(--font-display);font-size:13px;font-weight:800;color:#C6D5EA;
  padding:11px 20px;border-radius:var(--chip-radius);border:1px solid var(--line-strong);
  background:rgba(11,18,38,.55);backdrop-filter:blur(10px);
  transition:border-color var(--dur-fast),color var(--dur-fast),box-shadow var(--dur-fast)}
.fac-hub.ravan{--h-c:var(--brand-ravan-soft)}
.fac-hub i{inline-size:9px;block-size:9px;border-radius:50%;background:var(--h-c);box-shadow:0 0 14px var(--h-c)}
.fac-hub em{font-style:normal;font-size:11.5px;font-weight:500;color:#7E93B8}
.fac-hub:hover{border-color:var(--h-c);color:#fff;box-shadow:0 0 34px -10px var(--h-c)}
.fac-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,24px)}
@media(max-width:1000px){
.fac-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:680px){
.fac-grid{grid-template-columns:repeat(2,1fr)}
}
.fac-hub.all{cursor:pointer;color:var(--accent-soft);border-color:color-mix(in oklab,var(--accent) 40%,transparent);text-decoration:none}
.fac-hub.all:hover{border-color:var(--accent);color:#fff;box-shadow:0 0 34px -10px var(--accent)}
.fac-card{--t-c:var(--brand-modir);position:relative;display:block;text-decoration:none;color:#fff;
  border-radius:20px;overflow:hidden;border:1px solid var(--line);background:rgba(11,18,38,.55);
  backdrop-filter:blur(8px);
  transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base),box-shadow var(--dur-base)}
.fac-card.ravan{--t-c:var(--brand-ravan)}
.fac-card:hover,.fac-card:focus-visible{transform:translateY(-8px);border-color:color-mix(in oklab,var(--t-c) 62%,transparent);
  box-shadow:0 0 46px -14px color-mix(in oklab,var(--t-c) 80%,transparent)}
.fac-card .n{position:absolute;z-index:2;inset-block-start:11px;inset-inline-start:11px;font-size:10.5px;
  padding:5px 11px;border-radius:var(--chip-radius);background:rgba(5,7,15,.6);color:#DCE7F7;backdrop-filter:blur(6px)}
.fac-card .info{display:block;padding:15px 16px 17px}
.fac-card .info b{display:block;font-family:var(--font-display);font-size:15px;font-weight:800;line-height:1.6}
.fac-card .info span{display:block;margin-block-start:6px;font-size:11.5px;color:#93A5C6;line-height:1.9}
.grad-fig{order:2;position:relative;min-block-size:min(58vh,470px);cursor:pointer;border-radius:26px;
  transition:background var(--dur-base)}
.grad-fig:hover{background:rgba(34,211,238,.03)}
.grad-fig .hint{position:absolute;inset-block-end:-12px;inset-inline:0;display:flex;justify-content:center;pointer-events:none}
.grad-fig .hint i{font-style:normal;white-space:nowrap;font-size:11.5px;color:#7E93B8;letter-spacing:.3px;
  padding:8px 18px;border-radius:var(--chip-radius);border:1px solid var(--line);
  background:rgba(5,7,15,.72);backdrop-filter:blur(8px);transition:color var(--dur-fast),border-color var(--dur-fast)}
.grad-fig:hover .hint i{color:#DCE7F7;border-color:var(--accent)}
@media(max-width:900px){
.grad-fig{min-block-size:46vh;order:2}
}
.grad-copy{order:1}
.grad-copy .k{color:var(--accent-soft)}
.grad-quote{margin-block-start:26px;min-block-size:210px}
.grad-quote p{font-size:clamp(16px,1.9vw,21px);line-height:2.2;color:#E6EEFA;text-wrap:pretty;
  transition:opacity .35s var(--ease-soft),transform .45s var(--ease-out)}
.grad-quote.swap p{opacity:0;transform:translateY(14px)}
.grad-who{display:flex;align-items:center;gap:14px;margin-block-start:26px;
  transition:opacity .35s var(--ease-soft)}
.grad-quote.swap+.grad-who{opacity:.25}
.grad-who i{--w-c:var(--teal-600);display:grid;place-items:center;inline-size:46px;block-size:46px;border-radius:50%;
  font-style:normal;font-family:var(--font-display);font-weight:900;font-size:14px;color:#fff;flex:none;
  background:radial-gradient(120% 120% at 30% 0%,color-mix(in oklab,var(--w-c) 75%,#fff 8%),var(--navy-800));
  transition:background var(--dur-base)}
.grad-who i.modir{--w-c:var(--brand-modir)}
.grad-who i.ravan{--w-c:var(--brand-ravan)}
.grad-who b{display:block;font-family:var(--font-display);font-size:14.5px;font-weight:800;color:#fff}
.grad-who span{display:block;font-size:12px;color:#93A5C6;margin-block-start:5px}
.grad-nav{display:flex;align-items:center;gap:10px;margin-block-start:30px}
.grad-nav button{inline-size:34px;block-size:8px;border-radius:99px;border:0;padding:0;cursor:pointer;
  background:rgba(148,178,214,.24);transition:background var(--dur-fast),inline-size var(--dur-base) var(--ease-out)}
.grad-nav button[aria-current="true"]{background:var(--accent);inline-size:52px;
  box-shadow:0 0 18px color-mix(in oklab,var(--accent) 60%,transparent)}
.grad-nav button:hover{background:var(--accent-soft)}
.stations{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;
  margin-block:clamp(54px,7vw,86px) 0;position:relative}
@media(max-width:820px){
.stations{flex-direction:column;align-items:stretch;gap:12px;margin-block-start:36px}
}
.station{flex:none}
.station button{display:flex;align-items:center;gap:10px;cursor:pointer;font-family:var(--font-display);
  font-size:13px;font-weight:800;color:#9FB3D2;padding:12px 20px;border-radius:var(--chip-radius);
  border:1px solid var(--line-strong);background:rgba(11,18,38,.72);backdrop-filter:blur(10px);
  transition:color var(--dur-fast),border-color var(--dur-fast),box-shadow var(--dur-fast),transform var(--dur-fast) var(--ease-out)}
.station button em{font-style:normal;display:grid;place-items:center;inline-size:22px;block-size:22px;border-radius:50%;
  font-size:11px;background:rgba(148,178,214,.16);color:#C6D5EA;transition:background var(--dur-fast),color var(--dur-fast)}
.station.on button,.station button:hover{color:#fff;border-color:var(--accent);transform:translateY(-3px);
  box-shadow:0 0 40px -12px color-mix(in oklab,var(--accent) 85%,transparent)}
.station.on button em{background:var(--accent);color:#04121c}
.station-detail{margin-block-start:clamp(34px,4.4vw,58px);max-inline-size:600px;min-block-size:96px}
.station-detail h3{font-family:var(--font-display);font-size:clamp(17px,2vw,23px);font-weight:900;color:#fff;margin-block-end:12px;
  transition:opacity .3s var(--ease-soft)}
.station-detail p{font-size:14px;line-height:2.2;color:#9FB3D2;text-wrap:pretty;transition:opacity .3s var(--ease-soft)}
.station-detail.swap h3,.station-detail.swap p{opacity:0}
.journey-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  margin-block-start:clamp(44px,5.4vw,72px);padding-block-start:clamp(34px,4vw,50px);border-block-start:1px solid var(--line)}
.journey-cta h3{font-family:var(--font-display);font-size:clamp(19px,2.4vw,30px);font-weight:900;color:#fff;
  flex:1;min-inline-size:260px;line-height:1.65}
.journey-cta .note{inline-size:100%;font-size:12px;color:#66799C}
.vals{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:clamp(16px,2vw,26px)}
.val{padding:clamp(22px,2.4vw,30px);border-radius:var(--card-radius);border:1px solid var(--line);
  background:var(--bg-elev);transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base),box-shadow var(--dur-base)}
.val:hover{transform:translateY(-6px);border-color:color-mix(in oklab,var(--teal-400) 45%,transparent);
  box-shadow:0 28px 58px -30px rgba(11,18,38,.3)}
.val .ic{inline-size:50px;block-size:50px;border-radius:16px;display:grid;place-items:center;margin-block-end:17px;
  color:var(--teal-600);background:color-mix(in oklab,var(--teal-400) 12%,transparent);
  border:1px solid color-mix(in oklab,var(--teal-400) 24%,transparent)}
.val:nth-child(2) .ic{color:var(--gold-600);background:color-mix(in oklab,var(--gold-400) 14%,transparent);
  border-color:color-mix(in oklab,var(--gold-400) 30%,transparent)}
.val .ic svg{inline-size:23px;block-size:23px}
.val h3{font-family:var(--font-display);font-size:16.5px;font-weight:800;margin-block-end:11px}
.val p{font-size:13.5px;line-height:2.15;color:var(--fg-muted);text-wrap:pretty}
.grad-fig{background:transparent}
.grad-fig:hover{background:transparent}
.journey-space{block-size:clamp(280px,36vh,430px)}
.stations{position:absolute;inset:0;z-index:6;list-style:none;margin:0;pointer-events:none}
.station{position:absolute;top:0;left:0;right:auto;pointer-events:auto;
  will-change:transform,left,top,opacity}
.station button{display:flex;align-items:center;gap:10px;cursor:pointer;font-family:var(--font-display);
  font-size:13px;font-weight:800;white-space:nowrap;color:#9FB3D2;padding:11px 19px;border-radius:var(--chip-radius);
  border:1px solid var(--line-strong);background:rgba(7,11,24,.82);backdrop-filter:blur(12px);
  transition:color var(--dur-fast),border-color var(--dur-fast),box-shadow var(--dur-fast)}
.station button em{font-style:normal;display:grid;place-items:center;inline-size:22px;block-size:22px;border-radius:50%;
  font-size:11px;background:rgba(148,178,214,.16);color:#C6D5EA;transition:background var(--dur-fast),color var(--dur-fast)}
.station.on button,.station button:hover{color:#fff;border-color:var(--accent);
  box-shadow:0 0 44px -10px color-mix(in oklab,var(--accent) 90%,transparent)}
.station.on button em{background:var(--accent);color:#04121c}
@media(max-width:820px){
.journey-space{block-size:clamp(320px,44vh,420px)}
.station button{font-size:11.5px;padding:9px 14px}
}
.arc{position:relative;z-index:2;block-size:clamp(280px,40vh,420px);
  perspective:1750px;perspective-origin:50% 48%;margin-block-start:clamp(24px,4vw,52px)}
.arc-stage{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(-7deg)}
.arc-item{position:absolute;top:50%;left:50%;right:auto;margin:0;
  inline-size:clamp(210px,21vw,300px);transform-style:preserve-3d;will-change:transform,opacity,filter}
.arc-item figcaption{display:none}
.arc-cap{position:relative;z-index:4;text-align:center;margin-block-start:clamp(14px,2vw,26px);
  font-family:var(--font-display);font-size:clamp(14px,1.6vw,17px);font-weight:800;color:#DCE7F7;
  min-block-size:1.6em;transition:opacity var(--dur-fast)}
.arc-cap.swap{opacity:0}
.arc-hint{position:relative;z-index:3;text-align:center;margin-block-start:clamp(18px,2.4vw,32px);
  font-size:12px;color:#66799C;letter-spacing:.4px}
@media(max-width:700px){
.arc{block-size:clamp(240px,38vh,320px);perspective:1100px}
.arc-item{inline-size:min(74vw,300px)}
}
.camps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,26px)}
@media(max-width:1000px){
.camps{grid-template-columns:1fr}
}
.camp{--c-c:var(--brand-modir);display:grid;grid-template-columns:clamp(150px,17vw,210px) 1fr;
  border:1px solid var(--line);border-radius:var(--card-radius);overflow:hidden;background:var(--bg-elev);
  text-decoration:none;color:var(--fg);
  transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base),box-shadow var(--dur-base)}
.camp.ravan{--c-c:var(--brand-ravan)}
.camp:hover{transform:translateY(-7px);border-color:color-mix(in oklab,var(--c-c) 48%,transparent);
  box-shadow:0 32px 66px -32px rgba(11,18,38,.36)}
@media(max-width:560px){
.camp{grid-template-columns:1fr}
}
.camp .body{display:flex;flex-direction:column;gap:11px;padding:clamp(18px,2vw,26px)}
.camp .chips{display:flex;gap:8px;flex-wrap:wrap}
.camp>.body>b{font-family:var(--font-display);font-size:clamp(16px,1.8vw,20px);font-weight:900;line-height:1.65}
.camp .lede{font-size:13px;line-height:2.05;color:var(--fg-muted);margin:0;max-inline-size:none;text-wrap:pretty}
.camp .mods{display:flex;flex-wrap:wrap;gap:6px;margin-block-start:2px}
.camp .mods span{font-size:11px;padding:5px 11px;border-radius:8px;color:var(--fg-muted);
  background:color-mix(in oklab,var(--c-c) 8%,transparent);border:1px solid color-mix(in oklab,var(--c-c) 16%,transparent)}
.camp .foot{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-block-start:auto;padding-block-start:15px;border-block-start:1px solid var(--line)}
.camp .meta{display:flex;flex-direction:column;gap:7px;font-size:11.5px;color:var(--fg-muted)}
.camp .meta>span{display:flex;align-items:center;gap:6px}
.camp .meta svg{inline-size:13px;block-size:13px;opacity:.75}
.camp .price{text-align:end}
.camp .price b{display:block;font-family:var(--font-display);font-size:clamp(16px,1.7vw,19px);font-weight:900;
  color:color-mix(in oklab,var(--c-c) 78%,var(--fg))}
.camp .price span{font-size:11px;color:var(--fg-muted)}

/* --- هیرو در صفحه های کوتاه ---------------------------------------------
   ستون هیرو تا اینجا فقط با عرض صفحه تنظیم می شد، ولی ارتفاعش هم مهم است:
   روی نمایشگری که ارتفاع دیدش کمتر از حدود ۹۰۰ پیکسل است، مجموع فاصله
   بالا و بلوک متن و نوار اعداد اعتماد از قاب هیرو بلندتر می شود و نوار
   پایینی بیرون می زند و زیر لوح سفید بعدی گم می شود. در زیربرند این
   اختلاف بیشتر است چون نوار برند بالای صفحه هم جا می گیرد.
   اینجا فقط ریتم عمودی فشرده می شود؛ اندازه ها و رنگ ها دست نمی خورند. */
@media(max-height:900px){
.hero{padding-block-start:calc(var(--nav-height) + clamp(10px,1.6vh,22px))}
.hero-copy h1{font-size:clamp(30px,3.4vw,50px)}
.hero-copy .lede{margin-block-start:14px;line-height:1.95}
.hero-copy .finder{margin-block-start:20px}
.hero-copy .btns{margin-block-start:20px}
}