/* home.css */

/* === Home color tokens (hex only) === */
/* ===== توکن‌های رنگ و تم ===== */
:root{
  --txt1:#26343B;
  --txt2:#4A5C66;
  --txt3:#6F7242;

  --home-page-bg:#F4FBFF;
  --home-shell-bg:#F7FFF6;
  --home-hero-bg:#D6F2FF;
  --home-hero-txt1:#1C39BB;
  --home-hero-txt2:#00A693;
  --home-top-carousel-bg:#FEF4FB;
  --home-card-bg:#FFFFFF;
  --home-card-bg-alt:#E8ECFF;
  --home-final-bg:#1C39BB;
  --home-final-txt1:#EFF1FF;
  --home-final-txt2:#D6F2FF;
  --home-footer-bg:#FFF6EB;
  --home-footer-border:#FFCC8E;
  --home-footer-txt1:#C73810;
  --home-footer-txt2:#7E4A2E;
  --home-footer-txt3:#A66A45;

  --home-platform-bg:#FEFFF3;
  --home-platform-txt1:#4F5130;
  --home-platform-txt2:#6F7242;
  --home-platform-txt3:#4E3B59;

  --home-btn-primary-bg:#2FB36D;
  --home-btn-primary-bg-hover:#249257;
  --home-btn-primary-text:#F4FFF8;
  --home-btn-ghost-bg:#FFFFFF;
  --home-btn-ghost-text:#26343B;
  --home-btn-ghost-border:#2FB36D;

  --home-header-btn-bg:#EEF2F4;
  --home-header-btn-bg-hover:#E0E7EA;
  --home-header-btn-border:#7E8D94;
  --home-header-signup-bg:#2FB36D;
  --home-header-signup-bg-hover:#249257;
  --home-header-signup-border:#2FB36D;
  --home-header-signup-text:#F4FFF8;

  --home-carousel-media-grad-start:#1C39BB;
  --home-carousel-media-grad-end:#00A693;
  --home-carousel-media-soon-start:#E8A8FD;
  --home-carousel-media-soon-end:#FAC6E6;
  --home-carousel-fallback-bg:rgba(0,0,0,.24);
  --home-carousel-fallback-text:#ffffff;
  --home-carousel-arrow-bg:rgba(255,255,255,.72);
  --home-carousel-arrow-bg-dark:rgba(255,255,255,.16);
  --home-carousel-dot-border:#1C39BB;
  --home-carousel-dot-bg:#FFFFFF;
  --home-tree-line:#9AA3AA;
  --home-tree-node:#26343B;
  --home-tree-note:#4F5130;
  --home-tree-playing:#2FB36D;
}

[data-theme="dark"]{
  --txt1:#EFF1FF;
  --txt2:#D6F2FF;
  --txt3:#F7D8EC;

  --home-page-bg:#060918;
  --home-shell-bg:#0E171D;
  --home-hero-bg:#0A0F2E;
  --home-hero-txt1:#D6F2FF;
  --home-hero-txt2:#80D6CB;
  --home-top-carousel-bg:#140F16;
  --home-card-bg:#1A262E;
  --home-card-bg-alt:#1B261C;
  --home-final-bg:#F7E1DB;
  --home-final-txt1:#501606;
  --home-final-txt2:#972B0D;
  --home-footer-bg:#1A130C;
  --home-footer-border:#D7603E;
  --home-footer-txt1:#FFD9A8;
  --home-footer-txt2:#F7E1DB;
  --home-footer-txt3:#D6DA6E;

  --home-platform-bg:#1A1B10;
  --home-platform-txt1:#FEFFD9;
  --home-platform-txt2:#A8AA66;
  --home-platform-txt3:#F0C9FE;

  --home-btn-primary-bg:#25A760;
  --home-btn-primary-bg-hover:#1F8A50;
  --home-btn-primary-text:#E9FFF2;
  --home-btn-ghost-bg:#0E171D;
  --home-btn-ghost-text:#EFF1FF;
  --home-btn-ghost-border:#25A760;

  --home-header-btn-bg-dark:#223038;
  --home-header-btn-bg-hover-dark:#2D3C45;
  --home-header-btn-border-dark:#6E818A;
  --home-header-signup-bg-dark:#25A760;
  --home-header-signup-bg-hover-dark:#1F8A50;
  --home-header-signup-border-dark:#25A760;
  --home-header-signup-text-dark:#E9FFF2;

  --home-carousel-media-grad-start:#1C39BB;
  --home-carousel-media-grad-end:#00A693;
  --home-carousel-media-soon-start:#E8A8FD;
  --home-carousel-media-soon-end:#F77FBE;
  --home-carousel-fallback-bg:rgba(4,10,18,.48);
  --home-carousel-fallback-text:#f4f9ff;
  --home-carousel-arrow-bg:rgba(255,255,255,.16);
  --home-carousel-arrow-bg-dark:rgba(255,255,255,.16);
  --home-carousel-dot-border:#8799E1;
  --home-carousel-dot-bg:#1A262E;
  --home-tree-line:#6E757C;
  --home-tree-node:#EFF1FF;
  --home-tree-note:#F7D8EC;
  --home-tree-playing:#3FD07D;
}

/* ===== تنظیمات پایه سراسری ===== */
*{box-sizing:border-box}
html,body{height:100%}
html{direction:ltr}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial;color:var(--txt1);background:var(--home-shell-bg);overflow-x:hidden}
.wrap{max-width:1160px;margin:0 auto;padding:18px 18px 36px;position:relative;z-index:1}
.wrap--main{padding-top:6px}
main.home-v2{background:var(--home-shell-bg);color:var(--txt1);width:100vw;max-width:100vw;margin:0;margin-inline:calc(50% - 50vw);padding-inline:clamp(14px, 3vw, 34px);padding-bottom:0}
.topbar-right .text-btn{background:var(--home-header-btn-bg);border:1px solid var(--home-header-btn-border);color:var(--txt1)}
.topbar-right .text-btn:hover{background:var(--home-header-btn-bg-hover)}
.topbar-right .topbar-signup{background:var(--home-header-signup-bg);border:1px solid var(--home-header-signup-border);color:var(--home-header-signup-text)}
.topbar-right .topbar-signup:hover{background:var(--home-header-signup-bg-hover)}
[data-theme="dark"] .topbar-right .text-btn{background:var(--home-header-btn-bg-dark);border-color:var(--home-header-btn-border-dark);color:var(--txt1)}
[data-theme="dark"] .topbar-right .text-btn:hover{background:var(--home-header-btn-bg-hover-dark)}
[data-theme="dark"] .topbar-right .topbar-signup{background:var(--home-header-signup-bg-dark);border-color:var(--home-header-signup-border-dark);color:var(--home-header-signup-text-dark)}
[data-theme="dark"] .topbar-right .topbar-signup:hover{background:var(--home-header-signup-bg-hover-dark)}

.grain,
.ambient{
  display:none;
}
.glass{background:linear-gradient(180deg,var(--glass2),var(--glass));border:1px solid var(--stroke);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;position:relative;overflow:hidden}
.glass::before{display:none}
[data-theme="dark"] .glass::before{display:none}
@keyframes ringHue{from{--ring-angle:0deg}to{--ring-angle:360deg}}
@keyframes homeGoldBorderCycle{
  0%{border-color:#FFCC8E}
  25%{border-color:#FFD9A8}
  50%{border-color:#FDFFB8}
  75%{border-color:#D6DA6E}
  100%{border-color:#FFCC8E}
}

/* ===== اسلایدر بالای صفحه (Top Carousel) ===== */
.top-carousel{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);margin-top:12px;border-radius:28px;padding:16px;min-height:500px;position:relative;z-index:1;background:var(--home-top-carousel-bg);border:1px solid color-mix(in srgb,var(--stroke) 80%,transparent);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:hidden}
.top-carousel::after{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;background:conic-gradient(from var(--ring-angle,0deg),var(--c1),var(--c2),var(--c3),var(--c4),var(--c1));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none;animation:ringHue 5s linear infinite;opacity:.95}
.top-carousel__inner{width:min(1200px,95%);min-height:500px;margin:0 auto;position:relative}
.carousel-slide{display:grid;grid-template-columns:1fr 1.05fr;gap:16px;align-items:stretch;min-height:500px;animation:slideIn .55s var(--ease)}
@keyframes slideIn{from{opacity:.4;transform:translateX(18px)}to{opacity:1;transform:none}}
.carousel-slide__media{position:relative;min-height:260px;border-radius:20px;background:linear-gradient(135deg,var(--home-carousel-media-grad-start),var(--home-carousel-media-grad-end));border:1px solid color-mix(in srgb,var(--stroke) 70%,transparent);display:grid;place-items:center;overflow:hidden}
.carousel-slide__media.is-soon{background:linear-gradient(135deg,var(--home-carousel-media-soon-start),var(--home-carousel-media-soon-end))}
.carousel-slide__fallback{position:absolute;inset:auto 12px 12px 12px;padding:8px 10px;border-radius:10px;background:var(--home-carousel-fallback-bg);color:var(--home-carousel-fallback-text);font-size:12px;letter-spacing:.06em;text-transform:uppercase;z-index:2}
.carousel-slide__image{width:90%;max-width:420px;max-height:240px;object-fit:contain;z-index:1;filter:none}
.carousel-slide__media.is-empty .carousel-slide__image{display:none}
.carousel-slide__content{border-radius:20px;padding:22px;display:grid;align-content:center;gap:12px}
.slide-tag{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.carousel-slide__content h2{margin:0;font-size:clamp(1.2rem,2vw,2rem)}
.carousel-slide__content p{margin:0;color:var(--muted);line-height:1.8}
.slide-points{margin:0;padding:0 18px 0 0;display:grid;gap:6px;color:color-mix(in srgb,var(--text) 88%,transparent);font-size:14px}
.carousel-controls{position:absolute;left:18px;right:18px;bottom:18px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.carousel-controls .carousel-dots{position:absolute;left:50%;transform:translate(-50%, 8px)}
.carousel-arrow{pointer-events:auto;width:42px;height:42px;border-radius:50%;border:1px solid var(--stroke);background:var(--home-carousel-arrow-bg);color:var(--txt1);font-size:28px;line-height:1;cursor:pointer}
[data-theme="dark"] .carousel-arrow{background:var(--home-carousel-arrow-bg-dark)}
.carousel-dots{pointer-events:auto;display:flex;gap:6px;justify-content:center;align-items:center;width:max-content;margin-inline:auto}
.carousel-dots button{--dot-accent-a:var(--home-carousel-dot-border);--dot-accent-b:var(--home-carousel-dot-border);width:8px;height:8px;min-width:8px;min-height:8px;aspect-ratio:1/1;border-radius:50%;padding:0;flex:0 0 auto;border:1px solid color-mix(in srgb,var(--dot-accent-a) 70%, #ffffff 30%);background:#ffffff;cursor:pointer;transition:background-color .24s ease,border-color .24s ease,box-shadow .24s ease,transform .2s ease}
.carousel-dots button:nth-child(1){--dot-accent-a:#00A693;--dot-accent-b:#80D6CB}
.carousel-dots button:nth-child(2){--dot-accent-a:#1C39BB;--dot-accent-b:#8799E1}
.carousel-dots button:nth-child(3){--dot-accent-a:#FDFFB8;--dot-accent-b:#D6DA6E}
.carousel-dots button:nth-child(4){--dot-accent-a:#E8A8FD;--dot-accent-b:#F0C9FE}
.carousel-dots button:nth-child(5){--dot-accent-a:#DEFFD7;--dot-accent-b:#A3D69C}
.carousel-dots button:nth-child(6){--dot-accent-a:#C73810;--dot-accent-b:#D7603E}
.carousel-dots button.is-on{width:8px;height:8px;min-width:8px;min-height:8px;border-radius:50%;border-color:var(--dot-accent-a);background:linear-gradient(90deg,var(--dot-accent-a),var(--dot-accent-b));box-shadow:none}

.hero{border-radius:var(--r2);padding:18px;margin-top:10px}
.hero__top{display:grid;grid-template-columns:1.12fr .88fr;gap:14px;margin-top:6px;margin-bottom:14px}
.hero__text,.hero__mini{border-radius:22px;padding:18px}
.t-title{margin:0 0 10px;font-size:clamp(1.4rem,3vw,2.1rem)}
.t-sub{margin:0 0 16px;color:var(--muted);line-height:1.8;font-size:15px}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.btn{height:46px;padding:0 16px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--text);font-weight:650;transition:transform 240ms var(--ease);user-select:none}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.99)}
.btn--primary{border:1px solid color-mix(in srgb,var(--home-btn-primary-bg) 75%, #1d3f2d 25%);background:linear-gradient(135deg,var(--home-btn-primary-bg),var(--home-btn-primary-bg-hover));color:var(--home-btn-primary-text);box-shadow:none}
.btn--ghost,.btn--secondary{border:1px solid var(--home-btn-ghost-border);background:var(--home-btn-ghost-bg);color:var(--home-btn-ghost-text)}
.mini__title{margin:0 0 2px;font-size:15px}
.mini__row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hero__mini .pill{min-height:34px;width:86%;border-radius:12px;background:linear-gradient(90deg,rgba(0,0,0,.08),rgba(0,0,0,.03),rgba(0,0,0,.08));padding:8px 10px;display:flex;align-items:center;font-size:12px;line-height:1.45}
[data-theme="dark"] .hero__mini .pill{background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.06),rgba(255,255,255,.18))}
.dot{width:10px;height:10px;border-radius:999px;background:linear-gradient(180deg,rgba(45,227,212,.75),rgba(255,111,176,.45));opacity:.85}

.capabilities-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cap-card{border-radius:20px;padding:18px;display:grid;align-content:start;gap:12px;min-height:220px}
.cap-card h3{margin:0;font-size:1.05rem}
.cap-card p{margin:0;color:var(--muted);line-height:1.8;font-size:14px}
.cap-card--soon{border-color:color-mix(in srgb,var(--c3) 35%,var(--stroke))}


/* ======نت باکس ===== */
/* ===== شروع استایل‌های نت‌باکس ===== */

.hero-random-tree{
  margin:0 0 14px;
  border-radius:22px;
  border:2px solid #FFCC8E;
  animation:homeGoldBorderCycle 5s linear infinite;
  padding:18px;
  display:grid;
  gap:12px;
  --fs-tree-line: var(--home-tree-line);
  --fs-tree-node: var(--home-tree-node);
  --fs-tree-note: var(--home-tree-note);
  --home-nb-accent: var(--c2);
  --home-nb-accent-soft: color-mix(in srgb,var(--c2) 26%, transparent);
  --home-nb-playing: var(--home-tree-playing);
  --home-tree-active: var(--home-nb-playing);
  --home-note-gap: 14px;
  --home-note-step: 26px;
  --home-challenge-safe-top: calc(52px + env(safe-area-inset-top, 0px));
  --home-challenge-bottom-gap: calc(12px + env(safe-area-inset-bottom, 0px));
  transition:padding .24s ease, box-shadow .24s ease;
}
.hero-random-tree[data-challenge-open="false"]{ padding-bottom:12px }
.hero-random-tree[data-challenge-open="true"]{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  z-index:9999;
  margin:0;
  width:100vw;
  height:100dvh;
  max-width:none;
  border-radius:0;
  padding:var(--home-challenge-safe-top) 14px var(--home-challenge-bottom-gap);
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  background:color-mix(in srgb,var(--bg) 96%, #f5fbff);
  box-shadow:none;
}
body[data-theme="dark"] .hero-random-tree[data-challenge-open="true"]{ background:color-mix(in srgb,var(--bg) 94%, #050d16) }
body[data-theme="dark"] .hero-random-tree{
  --fs-tree-line: var(--home-tree-line);
  --fs-tree-node: var(--home-tree-node);
  --fs-tree-note: var(--home-tree-note);
  --home-nb-accent-soft: color-mix(in srgb,var(--c2) 36%, transparent);
  --home-nb-playing: var(--home-tree-playing);
  --home-tree-active: var(--home-nb-playing);
}

body[data-theme="dark"] .hero-showbox{ background:color-mix(in srgb,var(--card) 86%, #1A262E) }
body[data-theme="dark"] .hero-random-tree__stage{ background:color-mix(in srgb,var(--card) 84%, #1A262E); border-color:color-mix(in srgb,var(--stroke) 88%, transparent) }
body[data-theme="dark"] .hero-random-tree__notes .nb-staff .note{ color:color-mix(in srgb,var(--text) 88%, #EFF1FF) }
body[data-theme="dark"] .hero-random-tree__notes .nb-tuplet-bracket .tuplet-svg path{ stroke:color-mix(in srgb,var(--text) 72%, transparent) }
body[data-theme="dark"] .hero-random-tree__notes .nb-tuplet-label{ color:color-mix(in srgb,var(--text) 78%, #D6F2FF) }

.hero-random-tree__title{ margin:0; font-size:1.08rem }
.hero-random-tree__hint{ margin:0; color:var(--muted); font-size:.92rem }
.hero-random-tree__visual-stack{ display:grid; gap:10px; position:relative }
.hero-showbox{ position:relative; --home-global-staff-y:50%; border-radius:18px; min-height:140px; padding:0; border:0; background:color-mix(in srgb,var(--card) 94%, #f7fbff); box-shadow:none; overflow:hidden }
.hero-showbox::before{ content:""; position:absolute; left:-500vw; right:-500vw; top:var(--home-global-staff-y); border-top:2px solid color-mix(in srgb,var(--text) 76%, transparent); pointer-events:none; z-index:0 }
.hero-showbox__line{ display:none }
.hero-showbox__line line{ stroke:#111; stroke-width:1.8; vector-effect:non-scaling-stroke }
.hero-random-tree__notes{ position:relative; --home-staff-line-y:66%; --home-note-contact-offset:34px; --home-note-track-shift:calc(var(--home-staff-line-y) - var(--home-note-contact-offset)); --home-bracket-gap:10px; min-height:152px; height:100%; display:flex; align-items:stretch; gap:8px; overflow-x:auto; overflow-y:hidden; padding:0 10px; z-index:1; scroll-behavior:auto; pointer-events:none; user-select:none; -webkit-overflow-scrolling:touch; scrollbar-width:thin }
.hero-random-tree__notes .notebox{ position:relative; z-index:1; display:flex; flex-direction:column; justify-content:center; min-width:max-content; min-height:95%; height:95%; border:1px solid transparent; border-radius:14px; padding:0 8px; background:transparent !important; box-shadow:none; transition:border-color .2s ease, background-color .2s ease, box-shadow .2s ease; overflow:hidden; pointer-events:none }
.hero-random-tree__notes .notebox.is-playing{ border-color:var(--home-nb-playing) !important; background:transparent !important; box-shadow:none }
.noto-music-regular{ font-family:"Noto Music",sans-serif; font-weight:400; font-style:normal }
.hero-random-tree__notes .nb-staff{ position:relative; height:100%; display:flex; align-items:flex-start; line-height:1; padding:0; }
.hero-random-tree__notes .nb-staff-line{ display:block; position:absolute; left:6px; right:6px; top:var(--home-staff-line-y); border-top:2px solid transparent; pointer-events:none }
.hero-random-tree__notes .nb-track{ position:relative; display:flex; align-items:flex-start; gap:var(--home-note-gap); width:100%; height:100%; padding-top:0; transform:translateY(var(--home-note-track-shift)); z-index:1 }
.hero-random-tree__notes .nb-event{ flex:0 0 auto; width:calc(var(--home-note-step) * var(--nb-count, 1)); min-width:calc(var(--home-note-step) * var(--nb-count, 1)); display:flex; justify-content:center; align-items:flex-start; height:100%; position:relative }
.hero-random-tree__notes .nb-staff .note{ position:relative; display:inline-flex; align-items:flex-end; justify-content:center; width:24px; font-size:33px; color:var(--note,#1e1e1e); transform:none; line-height:1; transform-origin:center bottom }
.hero-random-tree__notes .nb-staff .note.is-rest{ font-size:29px; transform:translateY(1px) }
.hero-random-tree__notes .nb-event--tuplet{ padding-bottom:0 }
.hero-random-tree__notes .nb-tuplet-notes{ width:100%; display:flex; justify-content:space-between; align-items:flex-start; gap:0 }
.hero-random-tree__notes .nb-tuplet-bracket{ position:absolute; left:0; right:0; top:calc(var(--home-staff-line-y) + var(--home-bracket-gap) - var(--home-note-track-shift)); height:14px; pointer-events:none }
.hero-random-tree__notes .nb-tuplet-bracket .tuplet-svg{ width:100%; height:100%; transform:none }
.hero-random-tree__notes .nb-tuplet-bracket .tuplet-svg path{ fill:none; stroke:var(--home-nb-accent-soft); stroke-width:1.8 }
.hero-random-tree__notes .nb-tuplet-label{ position:absolute; left:50%; top:calc(var(--home-staff-line-y) + var(--home-bracket-gap) + 14px - var(--home-note-track-shift)); transform:translate(-50%, 0); font-size:12px; font-weight:700; color:var(--home-nb-accent); line-height:1 }
.hero-random-tree__notes .nb-staff .note.is-playing-note{ color:var(--home-nb-playing) !important; -webkit-text-fill-color:var(--home-nb-playing); text-shadow:none }
.hero-random-tree__stage{ border-radius:18px; min-height:390px; padding:14px 12px; background:color-mix(in srgb,var(--card) 94%, #f7fbff); border:1px solid color-mix(in srgb,var(--stroke) 80%,transparent); box-shadow:none }

.hero-rhythm-challenge{ display:grid; gap:10px; margin-top:6px }
.hero-random-tree[data-challenge-open="false"] .hero-rhythm-challenge__panel{ display:none }

.hero-random-tree[data-challenge-open="true"] .hero-random-tree__title,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__launch,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__best{ display:none }
.hero-random-tree[data-challenge-open="true"] .hero-random-tree__stage{ min-height:clamp(320px, 52vh, 520px) }
.hero-rhythm-challenge__close{ display:none; position:fixed; top:12px; right:14px; z-index:8; width:32px; height:32px; padding:0; border:0; background:transparent; color:var(--text); line-height:1; cursor:pointer; box-shadow:none }
.hero-rhythm-challenge__close svg{ width:100%; height:100% }
.hero-rhythm-challenge__close svg path{ fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round }
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__close{ display:inline-flex; align-items:center; justify-content:center }
body.challenge-fullscreen-open{ overflow:hidden }
body.challenge-fullscreen-open main,
body.challenge-fullscreen-open footer,
body.challenge-fullscreen-open .topbar{ visibility:hidden }
.hero-random-tree[data-challenge-open="true"] > *{ min-width:0 }
.hero-random-tree[data-challenge-open="true"] .hero-random-tree__visual-stack,
.hero-random-tree[data-challenge-open="true"] .hero-showbox,
.hero-random-tree[data-challenge-open="true"] .hero-random-tree__stage,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__panel{ width:100%; max-width:100%; min-width:0 }
.hero-random-tree[data-challenge-open="true"] .hero-random-tree__visual-stack{ position:relative; z-index:6 }
.hero-random-tree[data-challenge-open="true"] .hero-showbox{ position:relative; z-index:6; min-height:clamp(112px, 20vh, 180px) }
.hero-random-tree[data-challenge-open="true"] .hero-random-tree__stage{ position:relative; z-index:6; min-height:clamp(360px, 58vh, 620px); overflow:visible }
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge{ position:relative; z-index:3; margin-top:2px }
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__panel{ display:grid; grid-template-columns:minmax(0,1fr); gap:10px; position:relative; z-index:3 }
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(136px,1fr)); gap:8px }
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions--end{
  position:relative;
  z-index:3;
  margin-top:8px;
  padding-bottom:max(0px, env(safe-area-inset-bottom, 0px));
}
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions .btn,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input-row [data-home-challenge-check],
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__difficulty{ width:100%; min-width:0 }
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__help-btn,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-help__close,
.hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__close{ touch-action:manipulation }
.hero-random-tree[data-challenge-open="true"][data-challenge-playing="true"] .hero-rhythm-challenge__input-row{
  position:relative;
  z-index:3;
  margin-top:6px;
  padding-bottom:max(0px, env(safe-area-inset-bottom, 0px));
}
.hero-rhythm-challenge__launch{
  width:100%; min-height:56px; font-size:1.05rem; font-weight:850;
  border:none; color:#fff;
  background:linear-gradient(135deg, color-mix(in srgb,var(--c2) 82%, #ffffff) 0%, color-mix(in srgb,var(--c3) 65%, #ffffff) 100%);
  box-shadow:none;
}
.hero-rhythm-challenge__launch:hover{ transform:translateY(-1px); filter:saturate(1.08) }
.hero-rhythm-challenge__launch:active{ transform:translateY(0) scale(.995) }
.hero-rhythm-challenge__best{
  justify-self:center; width:min(74%, 340px); min-height:42px; padding:0 14px;
  font-size:.86rem; font-weight:720; border-radius:13px;
  border:1px solid color-mix(in srgb,var(--c2) 48%, var(--stroke));
  color:color-mix(in srgb,var(--text) 92%, #0f2f60);
  background:linear-gradient(135deg, color-mix(in srgb,var(--card) 90%, #fff), color-mix(in srgb,var(--c2) 15%, var(--card)));
  box-shadow:none;
}
.hero-rhythm-challenge__best.is-rain-on{
  border-color:color-mix(in srgb,var(--c3) 62%, var(--stroke));
  background:linear-gradient(135deg, color-mix(in srgb,var(--c3) 24%, var(--card)), color-mix(in srgb,var(--c2) 30%, #fff));
}
.hero-rhythm-challenge__panel{ display:grid; gap:10px; padding:12px; border:1px solid color-mix(in srgb,var(--stroke) 82%, transparent); border-radius:16px; background:color-mix(in srgb,var(--card) 94%, transparent) }
.hero-rhythm-challenge__actions{ display:flex; gap:8px; flex-wrap:wrap }
.hero-rhythm-challenge__actions--end{ margin-top:4px }
.hero-rhythm-challenge__actions--end .btn{ width:100% }
.hero-rhythm-challenge__actions .btn{ flex:1 1 160px; font-weight:780 }
.hero-rhythm-challenge__actions [data-home-challenge-start]{
  position:relative;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--ok) 74%, #ffffff);
  color:#ffffff;
  background:linear-gradient(120deg,
    color-mix(in srgb,var(--ok) 92%, #20d67a) 0%,
    color-mix(in srgb,var(--c2) 86%, #2c8fff) 52%,
    color-mix(in srgb,var(--c3) 78%, #9f7bff) 100%
  );
  background-size:170% 170%;
  box-shadow:none;
  text-shadow:none;
}
.hero-rhythm-challenge__actions [data-home-challenge-start]:hover{
  filter:saturate(1.12) brightness(1.03);
  box-shadow:none;
}
.hero-rhythm-challenge__actions [data-home-challenge-start]:active{
  transform:translateY(0) scale(.992);
  filter:saturate(1.05);
}
.hero-rhythm-challenge__actions [data-home-challenge-pause],
.hero-rhythm-challenge__input-row [data-home-challenge-check]{ border:1px solid color-mix(in srgb,var(--c2) 38%, var(--stroke)); background:color-mix(in srgb,var(--card) 92%, var(--c2)); }
.hero-rhythm-challenge__actions [data-home-challenge-stop].hero-rhythm-challenge__stop-icon{
  min-height:46px;
  border:1px solid color-mix(in srgb,#e03b54 52%, var(--stroke));
  background:color-mix(in srgb,var(--card) 95%, #ffffff);
  box-shadow:none;
  padding:0 12px;
  width:auto;
  min-width:132px;
  max-width:100%;
  flex:0 1 auto;
  justify-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:14px;
  color:color-mix(in srgb,#d21f46 78%, var(--text));
  font-weight:760;
}
.hero-rhythm-challenge__stop-icon svg{ width:22px; height:22px; display:block; margin:0 }
.hero-rhythm-challenge__stop-icon span{ line-height:1; white-space:nowrap }
.hero-rhythm-challenge__stop-icon svg rect{ fill:currentColor; stroke:none }
.hero-rhythm-challenge__actions [data-home-challenge-stop].hero-rhythm-challenge__stop-icon:hover{ filter:saturate(1.08) brightness(1.02); transform:translateY(-1px) }
body[data-theme="dark"] .hero-rhythm-challenge__actions [data-home-challenge-stop].hero-rhythm-challenge__stop-icon{
  color:color-mix(in srgb,#ff7f98 84%, #f2f6ff);
  background:color-mix(in srgb,var(--card) 84%, #0f1a29);
  border-color:color-mix(in srgb,#ff7f98 44%, var(--stroke));
  box-shadow:none;
}
.hero-rhythm-challenge__actions--end{ display:flex; justify-content:center; margin-top:4px }

.hero-rhythm-challenge__difficulty-row{ display:grid; gap:6px }
.hero-rhythm-challenge__difficulty-head{ display:flex; align-items:center; justify-content:space-between; gap:8px }
.hero-rhythm-challenge__help-btn{ border:0; background:transparent; color:var(--muted); font:inherit; font-weight:900; font-size:1rem; width:24px; height:24px; line-height:1; border-radius:999px; cursor:pointer; padding:0 }
.hero-rhythm-challenge__help-btn:hover{ color:var(--text); box-shadow:none }
.hero-rhythm-help{ position:fixed; inset:0; z-index:90; background:transparent; display:grid; place-items:center; padding:18px }
.hero-rhythm-help[hidden]{ display:none !important }
.hero-rhythm-help__dialog{ width:min(640px, 95vw); max-height:none; overflow:visible; padding:14px 16px 16px; border-radius:16px; position:relative; direction:rtl; text-align:right; background:#fff; color:#16212f; border:0; box-shadow:none }
.hero-rhythm-help__dialog h4{ margin:0 34px 8px 0; font-size:1rem }
.hero-rhythm-help__dialog p{ margin:0 0 10px; color:inherit; line-height:1.8; font-size:.92rem; overflow-wrap:anywhere }
.hero-rhythm-help__dialog ul,.hero-rhythm-help__list{ margin:0 0 10px; padding:0 18px 0 0; display:grid; gap:8px }
.hero-rhythm-help__dialog li{ color:inherit; line-height:1.7; font-size:.9rem; overflow-wrap:anywhere }
.hero-rhythm-help__close{ position:absolute; top:8px; right:8px; border:0; background:transparent; color:var(--muted); font:inherit; font-size:1.2rem; width:28px; height:28px; border-radius:999px; cursor:pointer }
.hero-rhythm-help__close:hover{ color:var(--text); box-shadow:none }
body[data-theme="dark"] .hero-rhythm-help{ background:transparent }
body[data-theme="dark"] .hero-rhythm-help__dialog{ background:#111a27; color:#e6f0ff; box-shadow:none }

.hero-rhythm-challenge__difficulty{ min-height:44px; border-radius:12px; border:1px solid color-mix(in srgb,var(--c2) 35%, var(--stroke)); background:color-mix(in srgb,var(--card) 95%, transparent); color:var(--text); font:inherit; padding:0 10px }
.hero-rhythm-challenge__difficulty:disabled{ opacity:.6; cursor:not-allowed }
.hero-rhythm-challenge__actions .btn.btn--primary{ border:1px solid color-mix(in srgb,var(--c2) 44%, var(--stroke)); color:color-mix(in srgb,var(--text) 95%, #ffffff); background:linear-gradient(135deg, color-mix(in srgb,var(--c2) 22%, var(--card)), color-mix(in srgb,var(--c3) 20%, var(--card))); box-shadow:none }
body[data-theme="dark"] .hero-rhythm-challenge__actions .btn.btn--primary{ color:#eef6ff; background:linear-gradient(135deg, color-mix(in srgb,var(--c2) 36%, #0b1726), color-mix(in srgb,var(--c3) 26%, #0b1726)) }
.hero-rhythm-challenge__label{ font-size:.92rem; color:var(--muted) }
.hero-rhythm-challenge__input-row{ display:flex; gap:8px; flex-wrap:wrap }
.hero-rhythm-challenge__input{ flex:1 1 220px; min-height:46px; border-radius:14px; border:1px solid color-mix(in srgb,var(--stroke) 84%, transparent); background:color-mix(in srgb,var(--card) 96%, transparent); color:var(--text); padding:0 12px; font:inherit }
.hero-rhythm-challenge__status{ margin:0; min-height:24px; font-weight:650; color:var(--text) }
body[data-theme="dark"] .hero-rhythm-challenge__launch{ color:#e9f5ff; box-shadow:none }
body[data-theme="dark"] .hero-rhythm-challenge__best{ color:color-mix(in srgb,var(--text) 88%, #dbeaff) }
body[data-theme="dark"] .hero-rhythm-challenge__actions [data-home-challenge-start]{
  border-color:color-mix(in srgb,var(--c2) 58%, #bce0ff);
  background:linear-gradient(120deg,
    color-mix(in srgb,var(--ok) 78%, #13a65f) 0%,
    color-mix(in srgb,var(--c2) 82%, #2563eb) 56%,
    color-mix(in srgb,var(--c3) 74%, #6d28d9) 100%
  );
  box-shadow:none;
}

.challenge-rain-overlay{ position:fixed; inset:0; pointer-events:none; z-index:80; overflow:hidden }
.challenge-rain-overlay .note{ position:absolute; top:-8vh; line-height:1; color:color-mix(in srgb,var(--c2) 86%, #fff); text-shadow:none; animation:challenge-note-fall linear forwards }
@keyframes challenge-note-fall{ from{ transform:translateY(-12vh) rotate(0deg); opacity:.2 } 10%{ opacity:1 } to{ transform:translateY(112vh) rotate(12deg); opacity:.22 } }
body[data-theme="dark"] .challenge-rain-overlay .note{ color:color-mix(in srgb,var(--c2) 92%, #d5e6ff) }
/* ===== پایان استایل‌های نت‌باکس ===== */
/* =====نمودار درختی==== */
/* ===== شروع استایل‌های نمودار درختی ===== */
.hero-random-tree .metronome-fullscreen__tree{
  width:min(980px, 95%);
  height:100%;
  min-height:500px;
  max-height:none;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-inline:auto;
}
.hero-random-tree .metronome-fullscreen__tree svg{ width:100%; height:100%; overflow:hidden }
.hero-random-tree .metronome-fullscreen__tree .tree-line{ stroke:var(--fs-tree-line); stroke-width:2; opacity:.8; z-index:1; pointer-events:none }
.hero-random-tree .metronome-fullscreen__tree .tree-node{ fill:var(--fs-tree-node); font-family:"Noto Music","Noto Sans Symbols 2",system-ui,sans-serif; font-weight:600; dominant-baseline:central; paint-order:normal; stroke:none; stroke-width:0; z-index:3; pointer-events:none }
.hero-random-tree .metronome-fullscreen__tree .tree-node--note{ fill:var(--fs-tree-note); font-weight:500 }
.hero-random-tree .metronome-fullscreen__tree .tree-node--root{ fill:var(--gold); font-size:clamp(40px, calc(8vw * var(--fs-tree-scale, 1)), 86px) }
.hero-random-tree .metronome-fullscreen__tree .tree-node--group{ font-size:clamp(18px, calc(3.5vw * var(--fs-tree-scale, 1)), 40px) }
.hero-random-tree .metronome-fullscreen__tree .tree-node--note{ font-size:clamp(10px, calc(2.1vw * var(--fs-tree-scale, 1)), 26px) }
.hero-random-tree .metronome-fullscreen__tree .tree-g{ isolation:isolate }
.hero-random-tree .metronome-fullscreen__tree .tree-node.is-active{ fill:var(--home-tree-active); opacity:1 }
.hero-random-tree .metronome-fullscreen__tree .tree-line.is-active{ stroke:var(--home-tree-active); opacity:1 }
/* duplicate removed: keep the primary 3-column definition above and rely on media queries */
.cap-card{ border-radius:20px; padding:18px; display:grid; align-content:start; gap:12px; min-height:220px }
.cap-card h3{ margin:0; font-size:1.06rem }
.cap-card p{ margin:0; color:var(--muted); line-height:1.85; font-size:14px }
.cap-card--soon{ border-color:color-mix(in srgb,var(--c3) 35%,var(--stroke)) }

@media (max-width:980px){
  .top-carousel{ min-height:620px; padding:14px }
  .carousel-slide.layout-right,.carousel-slide.layout-left{ grid-template-columns:1fr }
  .carousel-slide.layout-stack{ grid-template-rows:200px auto }
  .carousel-slide__media{ min-height:220px }
  .carousel-slide__image{ max-height:190px }
}

@media (max-width:680px){
  .top-carousel{ min-height:650px; border-radius:20px; padding:10px }
  .hero-random-tree{ padding:12px; gap:10px }
  .hero-random-tree__stage{ min-height:280px; padding:10px 8px }
  .hero-random-tree .metronome-fullscreen__tree{ min-height:280px; width:95%; max-width:95% }
  .hero-random-tree .metronome-fullscreen__tree .tree-node--root{ font-size:clamp(30px, calc(7vw * var(--fs-tree-scale, 1)), 58px) }
  .hero-random-tree .metronome-fullscreen__tree .tree-node--group{ font-size:clamp(13px, calc(3.1vw * var(--fs-tree-scale, 1)), 24px) }
  .hero-random-tree .metronome-fullscreen__tree .tree-node--note{ font-size:clamp(7px, calc(1.7vw * var(--fs-tree-scale, 1)), 14px) }
  .hero-random-tree__notes{ --home-staff-line-y:62%; --home-note-contact-offset:30px; --home-note-track-shift:calc(var(--home-staff-line-y) - var(--home-note-contact-offset)); --home-bracket-gap:8px }
  .hero-random-tree__notes .nb-staff .note{ font-size:30px }
  .hero-random-tree__notes .nb-staff .note.is-rest{ font-size:26px; transform:translateY(1px) }
  .hero-random-tree__notes .nb-tuplet-label{ font-size:11px }
  .hero-rhythm-challenge__launch{ min-height:52px; font-size:.98rem }
  .hero-rhythm-challenge__best{ width:min(86%, 320px); min-height:40px; font-size:.8rem }
  .hero-rhythm-challenge__panel{ padding:10px; display:flex; flex-direction:column; gap:10px }
  .hero-rhythm-challenge__actions--end{ order:99; margin-top:6px }
  .hero-rhythm-challenge__input{ min-height:44px }
  .carousel-slide{ padding:4px; gap:10px }
  .carousel-slide__content{ padding:14px }
  .carousel-slide__content h2{ font-size:1.05rem }
  .carousel-slide__content p{ font-size:13px; line-height:1.8 }
  .slide-points{ font-size:12px }
  .carousel-slide__image{ max-width:320px; max-height:170px }
  .carousel-dots button{ width:7px; height:7px }
  .carousel-dots button.is-on{ width:7px; height:7px }
  .capabilities-grid{ grid-template-columns:1fr }
}

/* ===== فوتر عمومی ===== */



.footer{
  margin-top: 0;
  padding-bottom: 28px;
}

.footer__panel{
  border-radius: 26px;
  padding: 18px;
  box-shadow: none;
  position:relative;
  overflow:hidden;
}
.footer__panel::before{
  display:none;
}
[data-theme="dark"] .footer__panel::before{ display:none; }

/* new grid (matches your current HTML: footer__grid--new + footer__colBox) */
.footer__grid--new{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  padding: 10px 6px 16px;
  border-bottom: 1px solid color-mix(in srgb, var(--stroke) 70%, transparent);
}

@media (max-width: 1100px){
  .footer__grid--new{
    grid-template-columns: repeat(2, 1fr);
  }
  .footer__grid--new > .footer__colBox[aria-label="Follow us"]{
    grid-column: 1 / -1;
  }
}

.footer__colBox{
  border-radius: 22px;
  padding: 14px;
  position: relative;
  background: linear-gradient(180deg, var(--glass2), var(--glass));
  border: 1px solid color-mix(in srgb, var(--stroke) 80%, transparent);
  overflow:hidden;
}

/* rotating ring per column (ONLY colors rotate) */
.footer__colBox::after{
  content:"";
  position:absolute;
  inset: 0;
  padding: 2px;
  border-radius: inherit;
  background: conic-gradient(from var(--ring-angle, 0deg), var(--c1), var(--c2), var(--c3), var(--c4), var(--c1));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: exclude;

  pointer-events:none;
  display:none;
}

/* footer headings */
.footer__title{
  margin: 6px 0 10px;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text) 72%, transparent);
}

/* small subheads inside first column */
.footer__subhead{
  margin: 12px 0 6px;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text) 62%, transparent);
}

/* links inside boxes */
.footer__colBox .footer__link{
  display:block;
  padding: 9px 10px;
  border-radius: 14px;
  text-decoration:none;
  color: color-mix(in srgb, var(--text) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--stroke) 75%, transparent);
  box-shadow: none;
  background: transparent;
  transition: transform 220ms var(--ease), border-color 220ms var(--ease), box-shadow 220ms var(--ease);
}

.footer__colBox .footer__link:hover{
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--c2) 40%, var(--stroke));
  box-shadow: none;
}

.footer__colBox .footer__link:active{ transform: translateY(0) scale(.99); }

.footer__colBox .footer__link.is-disabled{
  opacity: .55;
  cursor: not-allowed;
  pointer-events:none;
}

/* follow placeholders (4 tiles) */
.follow-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-top: 10px;
}

.follow-tile{
  height: 64px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--stroke) 75%, transparent);
  background: linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.12));
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  text-decoration:none;
  transition: transform 220ms var(--ease);
}
[data-theme="dark"] .follow-tile{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
}
.follow-tile:hover{ transform: translateY(-1px); }
.follow-tile:active{ transform: translateY(0); }

.follow-tile::before{
  content:"";
  width: 28px;
  height: 28px;
  background: var(--social-icon) no-repeat center / contain;
  transition: transform 220ms var(--ease), filter 220ms var(--ease);
  opacity: .95;
}

.follow-tile--instagram{
  --social-icon: url('data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%20stroke%3D%22%23000000%22%20stroke-width%3D%220.00032%22%20transform%3D%22matrix(1,%200,%200,%201,%200,%200)%22%3E%3Cg%20id%3D%22SVGRepo_bgCarrier%22%20stroke-width%3D%220%22%3E%3C/g%3E%3Cg%20id%3D%22SVGRepo_tracerCarrier%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke%3D%22%23CCCCCC%22%20stroke-width%3D%220.256%22%3E%3C/g%3E%3Cg%20id%3D%22SVGRepo_iconCarrier%22%3E%20%3Crect%20x%3D%222%22%20y%3D%222%22%20width%3D%2228%22%20height%3D%2228%22%20rx%3D%226%22%20fill%3D%22url(%23paint0_radial_87_7153)%22%3E%3C/rect%3E%20%3Crect%20x%3D%222%22%20y%3D%222%22%20width%3D%2228%22%20height%3D%2228%22%20rx%3D%226%22%20fill%3D%22url(%23paint1_radial_87_7153)%22%3E%3C/rect%3E%20%3Crect%20x%3D%222%22%20y%3D%222%22%20width%3D%2228%22%20height%3D%2228%22%20rx%3D%226%22%20fill%3D%22url(%23paint2_radial_87_7153)%22%3E%3C/rect%3E%20%3Cpath%20d%3D%22M23%2010.5C23%2011.3284%2022.3284%2012%2021.5%2012C20.6716%2012%2020%2011.3284%2020%2010.5C20%209.67157%2020.6716%209%2021.5%209C22.3284%209%2023%209.67157%2023%2010.5Z%22%20fill%3D%22white%22%3E%3C/path%3E%20%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M16%2021C18.7614%2021%2021%2018.7614%2021%2016C21%2013.2386%2018.7614%2011%2016%2011C13.2386%2011%2011%2013.2386%2011%2016C11%2018.7614%2013.2386%2021%2016%2021ZM16%2019C17.6569%2019%2019%2017.6569%2019%2016C19%2014.3431%2017.6569%2013%2016%2013C14.3431%2013%2013%2014.3431%2013%2016C13%2017.6569%2014.3431%2019%2016%2019Z%22%20fill%3D%22white%22%3E%3C/path%3E%20%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6%2015.6C6%2012.2397%206%2010.5595%206.65396%209.27606C7.2292%208.14708%208.14708%207.2292%209.27606%206.65396C10.5595%206%2012.2397%206%2015.6%206H16.4C19.7603%206%2021.4405%206%2022.7239%206.65396C23.8529%207.2292%2024.7708%208.14708%2025.346%209.27606C26%2010.5595%2026%2012.2397%2026%2015.6V16.4C26%2019.7603%2026%2021.4405%2025.346%2022.7239C24.7708%2023.8529%2024.7708%2024.7708%2022.7239%2025.346C21.4405%2026%2019.7603%2026%2016.4%2026H15.6C12.2397%2026%2010.5595%2026%209.27606%2025.346C8.14708%2024.7708%207.2292%2023.8529%206.65396%2022.7239C6%2021.4405%206%2019.7603%206%2016.4V15.6ZM15.6%208H16.4C18.1132%208%2019.2777%208.00156%2020.1779%208.0751C21.0548%208.14674%2021.5032%208.27659%2021.816%208.43597C22.5686%208.81947%2023.1805%209.43139%2023.564%2010.184C23.7234%2010.4968%2023.8533%2010.9452%2023.9249%2011.8221C23.9984%2012.7223%2024%2013.8868%2024%2015.6V16.4C24%2018.1132%2023.9984%2019.2777%2023.9249%2020.1779C23.8533%2021.0548%2023.7234%2021.5032%2023.564%2021.816C23.1805%2022.5686%2022.5686%2023.1805%2021.816%2023.564C21.5032%2023.7234%2021.0548%2023.8533%2020.1779%2023.9249C19.2777%2023.9984%2018.1132%2024%2016.4%2024H15.6C13.8868%2024%2012.7223%2023.9984%2011.8221%2023.9249C10.9452%2023.8533%2010.4968%2023.7234%2010.184%2023.564C9.43139%2023.1805%208.81947%2022.5686%208.43597%2021.816C8.27659%2021.5032%208.14674%2021.0548%208.0751%2020.1779C8.00156%2019.2777%208%2018.1132%208%2016.4V15.6C8%2013.8868%208.00156%2012.7223%208.0751%2011.8221C8.14674%2010.9452%208.27659%2010.4968%208.43597%2010.184C8.81947%209.43139%209.43139%208.81947%2010.184%208.43597C10.4968%208.27659%2010.9452%208.14674%2011.8221%208.0751C12.7223%208.00156%2013.8868%208%2015.6%208Z%22%20fill%3D%22white%22%3E%3C/path%3E%20%3Cdefs%3E%20%3CradialGradient%20id%3D%22paint0_radial_87_7153%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientUnits%3D%22userSpaceOnUse%22%20gradientTransform%3D%22translate(12%2023)%20rotate(-55.3758)%20scale(25.5196)%22%3E%20%3Cstop%20stop-color%3D%22%23B13589%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%220.79309%22%20stop-color%3D%22%23C62F94%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%221%22%20stop-color%3D%22%238A3AC8%22%3E%3C/stop%3E%20%3C/radialGradient%3E%20%3CradialGradient%20id%3D%22paint1_radial_87_7153%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientUnits%3D%22userSpaceOnUse%22%20gradientTransform%3D%22translate(11%2031)%20rotate(-65.1363)%20scale(22.5942)%22%3E%20%3Cstop%20stop-color%3D%22%23E0E8B7%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%220.444662%22%20stop-color%3D%22%23FB8A2E%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%220.71474%22%20stop-color%3D%22%23E2425C%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23E2425C%22%20stop-opacity%3D%220%22%3E%3C/stop%3E%20%3C/radialGradient%3E%20%3CradialGradient%20id%3D%22paint2_radial_87_7153%22%20cx%3D%220%22%20cy%3D%220%22%20r%3D%221%22%20gradientUnits%3D%22userSpaceOnUse%22%20gradientTransform%3D%22translate(0.500002%203)%20rotate(-8.1301)%20scale(38.8909%208.31836)%22%3E%20%3Cstop%20offset%3D%220.156701%22%20stop-color%3D%22%23406ADC%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%220.467799%22%20stop-color%3D%22%236A45BE%22%3E%3C/stop%3E%20%3Cstop%20offset%3D%221%22%20stop-color%3D%22%236A45BE%22%20stop-opacity%3D%220%22%3E%3C/stop%3E%20%3C/radialGradient%3E%20%3C/defs%3E%20%3C/g%3E%3C/svg%3E');
}

.follow-tile--youtube{
  --social-icon: url('data:image/svg+xml,%3Csvg%20width%3D%22800px%22%20height%3D%22800px%22%20viewBox%3D%220%20-7%2048%2048%22%20version%3D%221.1%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%20xmlns:xlink%3D%22http://www.w3.org/1999/xlink%22%3E%3Ctitle%3EYoutube-color%3C/title%3E%3Cdesc%3ECreated%20with%20Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg%20id%3D%22Icons%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20id%3D%22Color-%22%20transform%3D%22translate(-200.000000,%20-368.000000)%22%20fill%3D%22%23CE1312%22%3E%3Cpath%20d%3D%22M219.044,391.269916%20L219.0425,377.687742%20L232.0115,384.502244%20L219.044,391.269916%20Z%20M247.52,375.334163%20C247.52,375.334163%20247.0505,372.003199%20245.612,370.536366%20C243.7865,368.610299%20241.7405,368.601235%20240.803,368.489448%20C234.086,368%20224.0105,368%20224.0105,368%20L223.9895,368%20C223.9895,368%20213.914,368%20207.197,368.489448%20C206.258,368.601235%20204.2135,368.610299%20202.3865,370.536366%20C200.948,372.003199%20200.48,375.334163%20200.48,375.334163%20C200.48,375.334163%20200,379.246723%20200,383.157773%20L200,386.82561%20C200,390.73817%20200.48,394.64922%20200.48,394.64922%20C200.48,394.64922%20200.948,397.980184%20202.3865,399.447016%20C204.2135,401.373084%20206.612,401.312658%20207.68,401.513574%20C211.52,401.885191%20224,402%20224,402%20C224,402%20234.086,401.984894%20240.803,401.495446%20C241.7405,401.382148%20243.7865,401.373084%20245.612,399.447016%20C247.0505,397.980184%20247.52,394.64922%20247.52,394.64922%20C247.52,394.64922%20248,390.73817%20248,386.82561%20L248,383.157773%20C248,379.246723%20247.52,375.334163%20247.52,375.334163%20L247.52,375.334163%20Z%22%20id%3D%22Youtube%22%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
}

.follow-tile--telegram{
  --social-icon: url('data:image/svg+xml,%3Csvg%20width%3D%22800px%22%20height%3D%22800px%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%2214%22%20fill%3D%22url(%23paint0_linear_87_7225)%22/%3E%3Cpath%20d%3D%22M22.9866%2010.2088C23.1112%209.40332%2022.3454%208.76755%2021.6292%209.082L7.36482%2015.3448C6.85123%2015.5703%206.8888%2016.3483%207.42147%2016.5179L10.3631%2017.4547C10.9246%2017.6335%2011.5325%2017.541%2012.0228%2017.2023L18.655%2012.6203C18.855%2012.4821%2019.073%2012.7665%2018.9021%2012.9426L14.1281%2017.8646C13.665%2018.3421%2013.7569%2019.1512%2014.314%2019.5005L19.659%2022.8523C20.2585%2023.2282%2021.0297%2022.8506%2021.1418%2022.1261L22.9866%2010.2088Z%22%20fill%3D%22white%22/%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22paint0_linear_87_7225%22%20x1%3D%2216%22%20y1%3D%222%22%20x2%3D%2216%22%20y2%3D%2230%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%2337BBFE%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23007DBB%22/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E');
}

.follow-tile--whatsapp{
  --social-icon: url('data:image/svg+xml,%3Csvg%20width%3D%22800px%22%20height%3D%22800px%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M16%2031C23.732%2031%2030%2024.732%2030%2017C30%209.26801%2023.732%203%2016%203C8.26801%203%202%209.26801%202%2017C2%2019.5109%202.661%2021.8674%203.81847%2023.905L2%2031L9.31486%2029.3038C11.3014%2030.3854%2013.5789%2031%2016%2031ZM16%2028.8462C22.5425%2028.8462%2027.8462%2023.5425%2027.8462%2017C27.8462%2010.4576%2022.5425%205.15385%2016%205.15385C9.45755%205.15385%204.15385%2010.4576%204.15385%2017C4.15385%2019.5261%204.9445%2021.8675%206.29184%2023.7902L5.23077%2027.7692L9.27993%2026.7569C11.1894%2028.0746%2013.5046%2028.8462%2016%2028.8462Z%22%20fill%3D%22%23BFC8D0%22/%3E%3Cpath%20d%3D%22M28%2016C28%2022.6274%2022.6274%2028%2016%2028C13.4722%2028%2011.1269%2027.2184%209.19266%2025.8837L5.09091%2026.9091L6.16576%2022.8784C4.80092%2020.9307%204%2018.5589%204%2016C4%209.37258%209.37258%204%2016%204C22.6274%204%2028%209.37258%2028%2016Z%22%20fill%3D%22url(%23paint0_linear_87_7264)%22/%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M16%2030C23.732%2030%2030%2023.732%2030%2016C30%208.26801%2023.732%202%2016%202C8.26801%202%202%208.26801%202%2016C2%2018.5109%202.661%2020.8674%203.81847%2022.905L2%2030L9.31486%2028.3038C11.3014%2029.3854%2013.5789%2030%2016%2030ZM16%2027.8462C22.5425%2027.8462%2027.8462%2022.5425%2027.8462%2016C27.8462%209.45755%2022.5425%204.15385%2016%204.15385C9.45755%204.15385%204.15385%209.45755%204.15385%2016C4.15385%2018.5261%204.9445%2020.8675%206.29184%2022.7902L5.23077%2026.7692L9.27993%2025.7569C11.1894%2027.0746%2013.5046%2027.8462%2016%2027.8462Z%22%20fill%3D%22white%22/%3E%3Cpath%20d%3D%22M12.5%209.49989C12.1672%208.83131%2011.6565%208.8905%2011.1407%208.8905C10.2188%208.8905%208.78125%209.99478%208.78125%2012.05C8.78125%2013.7343%209.52345%2015.578%2012.0244%2018.3361C14.438%2020.9979%2017.6094%2022.3748%2020.2422%2022.3279C22.875%2022.2811%2023.4167%2020.0154%2023.4167%2019.2503C23.4167%2018.9112%2023.2062%2018.742%2023.0613%2018.696C22.1641%2018.2654%2020.5093%2017.4631%2020.1328%2017.3124C19.7563%2017.1617%2019.5597%2017.3656%2019.4375%2017.4765C19.0961%2017.8018%2018.4193%2018.7608%2018.1875%2018.9765C17.9558%2019.1922%2017.6103%2019.083%2017.4665%2019.0015C16.9374%2018.7892%2015.5029%2018.1511%2014.3595%2017.0426C12.9453%2015.6718%2012.8623%2015.2001%2012.5959%2014.7803C12.3828%2014.4444%2012.5392%2014.2384%2012.6172%2014.1483C12.9219%2013.7968%2013.3426%2013.254%2013.5313%2012.9843C13.7199%2012.7145%2013.5702%2012.305%2013.4803%2012.05C13.0938%2010.953%2012.7663%2010.0347%2012.5%209.49989Z%22%20fill%3D%22white%22/%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22paint0_linear_87_7264%22%20x1%3D%2226.5%22%20y1%3D%227%22%20x2%3D%224%22%20y2%3D%2228%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%235BD066%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2327B43E%22/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E');
}

.follow-tile:hover::before{
  transform: translateY(-2px) scale(1.05);
  filter: brightness(1.05);
}

.follow-tile:active::before{
  transform: scale(.96) rotate(-4deg);
  filter: brightness(.98);
}

/* footer bottom */
.footer__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding: 14px 6px 6px;
}
@media (max-width: 980px){
  .footer__bottom{ flex-direction:column; align-items:flex-start; }
}

.footer__brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.footer__brandIcon{
  width: 52px;
  height: 52px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--stroke) 70%, transparent);
  background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.18));
  object-fit: cover;
}

.footer__brandLine1{
  font-weight: 800;
  letter-spacing: .2px;
}
.footer__brandLine2{
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

.footer__legal{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.footer__copy{
  font-size: 12px;
  color: var(--muted);
}

.footer__badges{
  display:flex;
  gap:10px;
}
.badge-chip{
  width: 76px;
  height: 42px;
  border-radius: 16px;
}


@media (max-width: 680px){
  .footer__panel{ padding: 12px; }
  .footer__grid--new{ grid-template-columns: 1fr; gap: 10px; padding: 6px 2px 12px; }
  .footer__grid--new > .footer__colBox[aria-label="Follow us"]{ grid-column: auto; }
  .footer__colBox{ padding: 12px; border-radius: 16px; }
  .footer__colBox .footer__link{ padding: 10px 8px; font-size: 13px; }
  .follow-grid{ gap: 8px; }
  .follow-tile{ height: 56px; border-radius: 14px; }
  .footer__bottom{ gap: 10px; padding: 12px 2px 0; }
  .footer__brand{ align-items:flex-start; }
  .footer__legal{ justify-content:flex-start; }
  .footer__badges{ width: 100%; }
  .badge-chip{ width: 64px; height: 34px; }
}

@media (max-width: 680px){
  .hero-random-tree[data-challenge-open="true"]{
    padding:calc(46px + env(safe-area-inset-top, 0px)) 10px calc(12px + env(safe-area-inset-bottom, 0px));
  }
  .hero-random-tree[data-challenge-open="true"] .hero-random-tree__visual-stack{ position:relative; z-index:7; gap:8px }
  .hero-random-tree[data-challenge-open="true"] .hero-showbox{ min-height:112px; border-radius:14px }
  .hero-random-tree[data-challenge-open="true"] .hero-random-tree__notes{ min-height:120px; --home-note-step:20px; --home-note-gap:8px; padding:0 8px; overflow-x:auto; overflow-y:hidden }
  .hero-random-tree[data-challenge-open="true"] .hero-random-tree__notes .nb-staff .note{ font-size:24px; width:20px }
  .hero-random-tree[data-challenge-open="true"] .hero-random-tree__stage{ min-height:340px; padding:10px; border-radius:14px; overflow:visible }
  .hero-random-tree[data-challenge-open="true"] .metronome-fullscreen__tree{ width:100%; min-width:0; max-width:100% }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__panel{ padding:10px; border-radius:14px; gap:8px }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input-row{ grid-template-columns:minmax(0,1fr) }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions .btn,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input-row [data-home-challenge-check],
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__difficulty{ min-height:44px; font-size:.95rem }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions [data-home-challenge-stop].hero-rhythm-challenge__stop-icon{
    width:100%;
    min-width:0;
  }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__difficulty-row,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__status,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__label{ overflow-wrap:anywhere }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-help{ padding:12px }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-help__dialog{ width:min(100%, 540px); max-height:calc(100dvh - 24px); overflow:auto; padding:12px 12px 14px; border-radius:14px }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-help__dialog h4{ margin:0 30px 8px 0; font-size:.94rem }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-help__dialog li{ font-size:.86rem; line-height:1.65 }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__close{ top:calc(8px + env(safe-area-inset-top, 0px)); right:10px; width:30px; height:30px }
}
@media (max-width: 380px){
  .hero-random-tree[data-challenge-open="true"]{ padding:var(--home-challenge-safe-top) 8px calc(10px + env(safe-area-inset-bottom, 0px)) }
  .hero-random-tree[data-challenge-open="true"] .hero-random-tree__notes{ --home-note-step:18px; --home-note-gap:7px }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__panel{ padding:8px }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__actions .btn,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input,
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__input-row [data-home-challenge-check],
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__difficulty{ min-height:42px; font-size:.9rem; padding-inline:10px }
  .hero-random-tree[data-challenge-open="true"] .hero-rhythm-challenge__close{ width:28px; height:28px }
}

/* homepage-transfer footer */
.footer--transfer .footer-transfer__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  border-radius:26px;
  padding:18px;
}
.footer-transfer__col{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid color-mix(in srgb,var(--stroke) 80%, transparent);border-radius:18px;background:linear-gradient(180deg,var(--glass2),var(--glass));}
.footer-transfer__col h4{margin:0 0 4px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--text) 78%, transparent);}
.footer-transfer__col a{color:color-mix(in srgb,var(--text) 90%, transparent);text-decoration:none;padding:7px 8px;border-radius:10px;border:1px solid transparent;transition:.2s ease;}
.footer-transfer__col a:hover{border-color:color-mix(in srgb,var(--stroke) 90%, transparent);background:color-mix(in srgb,var(--panel) 55%, transparent);}
.footer--transfer .footer__bottom{grid-column:1 / -1;border-top:1px solid color-mix(in srgb,var(--stroke) 75%, transparent);padding-top:16px;}
@media (max-width:900px){.footer--transfer .footer-transfer__grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:640px){.footer--transfer .footer-transfer__grid{grid-template-columns:1fr;padding:12px;}}

/* ===== شِل صفحه Home (Hero / Platform / Final / Footer) ===== */
/* Homepage hero انتقال مستقیم (HTML/CSS/JS parity for hero shell) */
.home-v2 .hero-wrap{
  background:var(--home-hero-bg);
  width:100vw;
  max-width:100vw;
  margin-inline:calc(50% - 50vw);
}
.home-v2 .hero.shell,
.home-v2 .hero-wrap .hero{
  width:100%;
  max-width:none;
  margin:0;
  border-radius:0;
  padding:56px max(16px, calc((100vw - 1200px) / 2)) 34px;
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  align-items:center;
  justify-content:space-between;
}
.home-v2 .hero.shell > *,
.home-v2 .hero-wrap .hero > *{ flex:1 1 320px; min-width:0 }
.home-v2 .hero-wrap .hero h1{font-size:64px;line-height:1.02;margin:0 0 12px;font-weight:800;color:var(--home-hero-txt1);max-width:8ch}
.home-v2 .hero-wrap .hero p{color:var(--home-hero-txt2);max-width:52ch;font-size:14px}
.home-v2 .hero-wrap .cta-row{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.home-v2 .hero-wrap .pill{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:var(--home-btn-primary-bg);color:var(--home-btn-primary-text);border:1px solid var(--home-btn-primary-bg);border-radius:999px;padding:9px 14px;font-weight:700;font-size:12px}
.home-v2 .hero-wrap .pill.ghost{background:var(--home-btn-ghost-bg);color:var(--home-btn-ghost-text);border:1px solid var(--home-btn-ghost-border)}
.home-v2 .hero-wrap .pill:hover{background:var(--home-btn-primary-bg-hover)}
.home-v2 .hero-wrap .hero-art{height:260px;border:1px solid var(--line-strong, rgba(255,255,255,.24));border-radius:16px;background:linear-gradient(135deg,#0d1b30,#081423);position:relative}
.home-v2 .hero-wrap .cart{position:absolute;right:36px;top:45px;width:210px;height:120px;border:3px solid #dce6f5;border-radius:6px;opacity:.85}
.home-v2 .hero-wrap .cart::before{content:"";position:absolute;left:-25px;top:20px;width:30px;height:3px;background:#dce6f5}
.home-v2 .hero-wrap .cart::after{content:"";position:absolute;right:18px;bottom:-28px;width:150px;height:3px;background:#dce6f5}
.home-v2 .hero-wrap .star{position:absolute;left:40px;bottom:46px;width:48px;height:48px;background:#f7b938;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 92%,50% 71%,21% 92%,32% 57%,2% 35%,39% 35%)}
.home-v2 .hero-wrap .hero-chip{position:absolute;right:10px;bottom:10px;background:var(--teal, #2be4df);color:var(--teal-deep, #04292c);border-radius:999px;padding:7px 12px;font-size:12px;font-weight:700}
@media (max-width:900px){
  .home-v2 .hero-wrap{
    width:100vw;
    max-width:100vw;
    margin-inline:calc(50% - 50vw);
  }
  .home-v2 .hero.shell,
  .home-v2 .hero-wrap .hero{
    width:100%;
    max-width:none;
    margin:0;
    border-radius:0;
    padding-inline:16px;
    flex-direction:column;
    align-items:stretch;
  }
  .home-v2 .hero-wrap .hero h1{font-size:44px;max-width:unset}
}

/* Homepage platform shell انتقال مستقیم */
.home-v2 > section:not(.hero-wrap){
  width:min(1200px, 100%);
  margin-inline:auto;
}

.platform,
.final,
.home-v2 .top-carousel,
.home-v2 .building{
  background:#ffffff;
}

.platform{
  padding:30px 0 12px;
  width:min(95%,1200px);
  margin-inline:auto;
  color:var(--home-platform-txt1);
}

.eyebrow{color:var(--home-platform-txt1);font-size:11px;font-weight:700;letter-spacing:.13em}
.home-v2 h2{font-size:64px;line-height:1.05;margin:8px 0 14px;max-width:15ch}
.lede{color:var(--home-platform-txt3);max-width:72ch;margin-bottom:24px;font-size:14px}
.feature-card{
  background:linear-gradient(135deg,#ffffff 0%, #f7fbff 58%, #eef6ff 100%);
  border:1px solid #d2e5f7;
  border-radius:16px;
  padding:24px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-bottom:14px;
  color:var(--txt1);
  box-shadow:none;
}
.feature-card.reverse .illustration{order:2}
.feature-card:nth-of-type(2){background:linear-gradient(135deg,#FFFFFF 0%, #E8ECFF 58%, #D6F2FF 100%);border-color:#8799E1}
.feature-card:nth-of-type(3){background:linear-gradient(135deg,#FFFFFF 0%, #FEECF5 58%, #FAC6E6 100%);border-color:#F77FBE}
.feature-card h3{font-size:42px;margin:0 0 8px;color:var(--home-platform-txt1)}
.feature-card p{color:var(--home-platform-txt2);font-size:13px}
.home-v2 ul{padding:0;list-style:none;margin:10px 0 0}
.home-v2 li{background:var(--home-card-bg-alt);padding:11px 12px;border:1px solid var(--home-footer-border);margin-bottom:8px;font-size:13px}
.link{display:inline-block;margin-top:8px;color:var(--home-platform-txt1);text-decoration:none;font-size:13px}
.illustration{border:2px solid #00A693;border-radius:10px;min-height:220px;opacity:.9}
.lines{background:repeating-linear-gradient(180deg,transparent,transparent 18px,rgba(0,166,147,.32) 19px)}
.widgets{background:none}
.clocks{background:none}

/* Homepage final shell انتقال مستقیم */
.final{text-align:center;padding:82px 0 74px; width:min(95%,1200px); margin-inline:auto;background:transparent;color:var(--home-final-txt1)}
.final h2{max-width:none;font-size:64px;margin-inline:auto}
.final-row{justify-content:center}
.final h1,.final h2,.final h3{color:var(--home-final-txt1)}
.final p,.final .t-sub{color:var(--home-final-txt2)}

/* Homepage footer انتقال مستقیم (newsletter -> footer__bottom) */
.footer.home{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:26px 12px 60px;border-top:1px solid var(--home-footer-border);background:var(--home-footer-bg);color:var(--home-footer-txt2);width:100vw;max-width:100vw;margin:0;margin-inline:calc(50% - 50vw)}
.footer.home h4{margin:0 0 10px;font-size:14px;color:var(--home-footer-txt1)}
.footer.home a{display:block;color:var(--home-footer-txt2);text-decoration:none;margin:5px 0;font-size:13px}
.footer.home a:hover{color:var(--home-footer-txt1)}
.footer.home > .footer__bottom{grid-column:1 / -1;border-top:1px solid var(--home-footer-border);padding-top:18px;margin-top:10px;color:var(--home-footer-txt3)}

/* top-carousel compact style */
.home-v2 .top-carousel{
  border:none;
  box-shadow:none;
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  width:min(95%,1200px);
  margin:4px auto 0;
  min-height:360px;
  padding:8px;
}
.home-v2 .top-carousel::after{display:none}
.home-v2 .top-carousel__inner{width:min(1200px,95%);min-height:320px}
.home-v2 .carousel-slide{min-height:320px;padding:2px}
.home-v2 .carousel-slide__content{padding:14px;gap:8px;background:linear-gradient(135deg,#ffffff 0%, #f5faff 100%);border:1px solid #cfe1f3}
.home-v2 .carousel-slide__content h2{font-size:clamp(1rem,1.5vw,1.5rem);line-height:1.35}
.home-v2 .carousel-slide__content p{font-size:12px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.home-v2 .slide-points li{font-size:12px;padding:0 10px;margin-bottom:6px;min-height:30px;display:flex;align-items:center}
.home-v2 .carousel-slide__media{min-height:230px;border:1px solid #bcd7ee;background:linear-gradient(135deg,#eaf4ff,#dff0ff)}
.home-v2 .carousel-slide__image{max-height:180px}
.home-v2 .top-carousel__inner{min-height:300px}
.home-v2 .carousel-track{transition:transform .9s cubic-bezier(.22,.85,.25,1)}
body[data-theme="dark"] .home-v2 .carousel-slide__content{ background:linear-gradient(135deg,#132336 0%, #1a2b3f 100%); border-color:#36516b; }
body[data-theme="dark"] .home-v2 .carousel-slide__media{ border-color:#3b5b7a; background:linear-gradient(135deg,#16304a,#173753); }

/* بهبود کنتراست متون هوم در هر دو تم */
.home-v2 .glass,
.home-v2 .carousel-slide__content,
.home-v2 .hero-random-tree,
.home-v2 .final {
  color: var(--text);
}
.home-v2 .carousel-slide__content p,
.home-v2 .t-sub,
.home-v2 .lede,
.home-v2 .cap-card p,
.home-v2 .feature-card p,
.home-v2 .slide-tag {
  color: var(--muted);
}

/* بهبود دیدپذیری اجزای چالش */
.hero-rhythm-challenge__panel{ background:#E8ECFF; border:1px solid #8799E1 }
.hero-rhythm-challenge__status{ color:#1C39BB; font-weight:600 }
.hero-rhythm-challenge__launch{ color:#00312C; background:linear-gradient(135deg,#DEFFD7 0%, #80D6CB 52%, #A3D69C 100%); border:1px solid #80D6CB }
.hero-rhythm-challenge__actions [data-home-challenge-start]{ color:#ffffff }
.hero-rhythm-challenge__input-row [data-home-challenge-check],
.hero-rhythm-challenge__actions [data-home-challenge-pause]{ background:#FFFFFF; color:#1C39BB; border:1px solid #8799E1 }

/* CTA */
.topbar-right .topbar-get-start{ min-width:104px; justify-content:center; font-weight:800; letter-spacing:0 }
.topbar-get-start{ min-height:34px; padding:0 12px; border-radius:999px; font-size:.78rem; font-weight:800; text-decoration:none; white-space:nowrap }
.final-row .final-get-start,
.final-get-start{ min-height:56px; min-width:min(420px, 92vw); border-radius:999px; font-size:1.04rem; font-weight:850; text-decoration:none }
.final-row .final-get-start{ background:linear-gradient(135deg,#DEFFD7 0%, #80D6CB 55%, #FFD9A8 100%); color:#00312C; border:1px solid #80D6CB; box-shadow:none }

/* spacing tune */
.home-v2 .top-carousel{ margin-top:4px; min-height:360px }
.home-v2 .building{ margin-top:4px }
.hero-random-tree{ margin:0 0 6px }

/* themes for capability carousel */
.home-v2 .carousel-theme--mint{--card-a:#00A693;--card-b:#80D6CB}
.home-v2 .carousel-theme--deep{--card-a:#1C39BB;--card-b:#8799E1}
.home-v2 .carousel-theme--sun{--card-a:#FDFFB8;--card-b:#D6DA6E}
.home-v2 .carousel-theme--violet{--card-a:#E8A8FD;--card-b:#F0C9FE}
.home-v2 .carousel-theme--teal{--card-a:#DEFFD7;--card-b:#A3D69C}
.home-v2 .carousel-theme--rose{--card-a:#C73810;--card-b:#D7603E}

.home-v2 .carousel-slide[class*="carousel-theme--"] .carousel-slide__media,
.home-v2 .carousel-slide[class*="carousel-theme--"] .carousel-slide__content{
  background:linear-gradient(135deg,var(--card-a),var(--card-b));
  color:#fff;
  border:1px solid rgba(255,255,255,.4);
}

@media (max-width:900px){
  .home-v2 .hero,
  .feature-card,
  .code-card{ grid-template-columns:1fr }
  .home-v2 h2,
  .feature-card h3,
  .final h2,
  .code-card h3{ font-size:38px }
  .footer.home{grid-template-columns:repeat(2,1fr)}
  main.home-v2{ padding-inline:14px }
  .platform{ padding-top:34px }
}


body[data-theme="dark"] .home-v2 .hero-wrap{ background:var(--home-hero-bg) }
body[data-theme="dark"] .home-v2 .hero-wrap .pill{ background:#00A693; border-color:#00A693; color:#E9FFFC }
body[data-theme="dark"] .home-v2 .hero-wrap .pill.ghost{ background:#0E171D; border-color:#40C0B3; color:#D6F2FF }
body[data-theme="dark"] .final-row .final-get-start{ background:linear-gradient(135deg,#00A693 0%, #1C39BB 55%, #C73810 100%); color:#E9FFFC; border-color:#00A693 }