/* =============================================
   BEYENI.ma — components.css
   Cards, hero, search, filtres, galeries
   ============================================= */

/* --- HERO --- */
.byn-hero {
  min-height:100vh; position:relative; display:flex; flex-direction:column;
  align-items:center; justify-content:center; padding:140px 5% 100px;
  overflow:hidden; background:#060a14;
}
.byn-hero__bg { position:absolute; inset:0 }
.byn-hero__mesh {
  position:absolute; inset:0; background:
    radial-gradient(ellipse 80% 60% at 20% 20%,rgba(93,65,255,.35) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 80% 80%,rgba(45,31,110,.5) 0%,transparent 60%),
    radial-gradient(ellipse 40% 40% at 60% 10%,rgba(139,114,255,.2) 0%,transparent 50%);
}
.byn-hero__noise {
  position:absolute; inset:0; opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.byn-hero__grid-lines {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(93,65,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(93,65,255,.07) 1px,transparent 1px);
  background-size:64px 64px;
}
.byn-hero__floating-card {
  position:absolute; background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1); border-radius:14px;
  padding:14px 18px; backdrop-filter:blur(16px);
  animation:byn-float 6s ease-in-out infinite;
}
@keyframes byn-float { 0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)} }
.byn-hero__fc-label { font-size:10px; color:rgba(255,255,255,.5); font-weight:600; letter-spacing:.5px; margin-bottom:4px }
.byn-hero__fc-val   { font-size:16px; font-weight:800; color:#fff }
.byn-hero__fc-sub   { font-size:11px; color:var(--byn-primary-3); margin-top:2px }
.byn-hero__content { position:relative; z-index:2; text-align:center; max-width:860px }
.byn-hero__chip {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(93,65,255,.18); border:1px solid rgba(93,65,255,.4);
  color:var(--byn-primary-3); padding:7px 18px; border-radius:50px;
  font-size:11.5px; font-weight:700; letter-spacing:.8px; margin-bottom:30px;
  text-transform:uppercase;
}
.byn-hero__chip-dot { width:7px; height:7px; background:var(--byn-primary-2); border-radius:50%; animation:byn-pulse 2s infinite }
@keyframes byn-pulse { 0%,100%{box-shadow:0 0 0 0 rgba(139,114,255,.6)}50%{box-shadow:0 0 0 6px rgba(139,114,255,0)} }
.byn-hero h1 { font-size:clamp(44px,6.5vw,82px); font-weight:900; color:#fff; line-height:1.03; letter-spacing:-3px; margin-bottom:24px }
.byn-hero h1 .line2 { display:block; background:linear-gradient(135deg,#a78bff 0%,#5D41FF 40%,#60a5fa 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text }
.byn-hero__sub { color:#8892a4; font-size:17.5px; line-height:1.72; max-width:580px; margin:0 auto 42px; font-weight:400 }
.byn-hero__ctas { display:flex; gap:14px; justify-content:center; margin-bottom:70px; flex-wrap:wrap }
.byn-hero__stats {
  display:flex; background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08); border-radius:18px;
  overflow:hidden; backdrop-filter:blur(16px);
}
.byn-hero__stat { flex:1; padding:26px; text-align:center; border-right:1px solid rgba(255,255,255,.06); position:relative }
.byn-hero__stat:last-child { border-right:none }
.byn-hero__stat-n { font-size:32px; font-weight:900; color:#fff; letter-spacing:-1px; line-height:1 }
.byn-hero__stat-n em { color:var(--byn-primary-2); font-style:normal }
.byn-hero__stat-l { font-size:12px; color:#4B5563; margin-top:6px; font-weight:500 }

/* --- Search Box --- */
.byn-search-wrap { margin-top:-36px; position:relative; z-index:10; padding:0 5% }
.byn-search-box {
  background:#fff; border-radius:20px;
  box-shadow:0 24px 80px rgba(13,19,33,.2),0 0 0 1px rgba(93,65,255,.08);
  padding:10px; max-width:980px; margin:0 auto;
}
.byn-search__tabs { display:flex; gap:4px; padding:6px; background:#F7F7FF; border-radius:13px; margin-bottom:10px }
.byn-search__tab { flex:1; padding:9px; text-align:center; border-radius:9px; font-size:13px; font-weight:600; cursor:pointer; color:var(--byn-gray); transition:.2s; border:none; background:transparent; font-family:var(--byn-font) }
.byn-search__tab:hover { color:var(--byn-dark) }
.byn-search__tab.on { background:#fff; color:var(--byn-primary); box-shadow:0 2px 10px rgba(93,65,255,.12) }
.byn-search__row { display:flex; align-items:center; gap:0; background:#F7F7FF; border-radius:13px; padding:4px; overflow:hidden; flex-wrap:wrap }
.byn-search__field { flex:1; padding:10px 18px; min-width:0; min-width:120px }
.byn-search__field label { font-size:10px; font-weight:800; color:var(--byn-gray); text-transform:uppercase; letter-spacing:.6px; display:block; margin-bottom:3px }
.byn-search__field select, .byn-search__field input { width:100%; border:none; outline:none; font-size:14px; font-weight:600; color:var(--byn-dark); background:transparent; cursor:pointer; font-family:var(--byn-font) }
.byn-search__div { width:1px; height:38px; background:var(--byn-border); flex-shrink:0 }
.byn-search__btn {
  background:var(--byn-primary); color:#fff; border:none; border-radius:11px;
  padding:14px 26px; font-size:14px; font-weight:700; cursor:pointer;
  display:flex; align-items:center; gap:9px; white-space:nowrap;
  transition:.2s; font-family:var(--byn-font);
  box-shadow:0 4px 16px rgba(93,65,255,.35); flex-shrink:0; margin:4px;
}
.byn-search__btn:hover { background:var(--byn-primary-dark); box-shadow:0 8px 24px rgba(93,65,255,.45) }

/* --- Property Cards --- */
.byn-prop-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px }
.byn-pcard {
  background:#fff; border-radius:var(--byn-radius-lg); overflow:hidden;
  border:1.5px solid var(--byn-border); transition:.35s; cursor:pointer;
  position:relative;
}
.byn-pcard:hover { transform:translateY(-8px); box-shadow:0 28px 60px rgba(93,65,255,.16); border-color:rgba(93,65,255,.25) }
.byn-pcard__img { height:218px; position:relative; overflow:hidden; background:linear-gradient(145deg,#1e1b4b,#2e1065); display:flex; align-items:center; justify-content:center }
.byn-pcard__img img { width:100%; height:100%; object-fit:cover; transition:.5s }
.byn-pcard:hover .byn-pcard__img img { transform:scale(1.08) }
.byn-pcard__overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(13,19,33,.5) 0%,transparent 50%) }
.byn-pcard__bdg {
  position:absolute; top:14px; left:14px; font-size:11px; font-weight:800;
  padding:5px 12px; border-radius:8px; letter-spacing:.3px; backdrop-filter:blur(8px);
}
.byn-pcard__fav {
  position:absolute; top:14px; right:14px; width:36px; height:36px;
  background:rgba(255,255,255,.9); border-radius:50%; display:grid;
  place-items:center; font-size:15px; cursor:pointer;
  backdrop-filter:blur(8px); transition:.25s;
  border:1.5px solid rgba(255,255,255,.5);
}
.byn-pcard__fav:hover { transform:scale(1.12) }
.byn-pcard__body { padding:18px 20px }
.byn-pcard__price { font-size:22px; font-weight:900; color:var(--byn-primary); letter-spacing:-.5px; margin-bottom:4px }
.byn-pcard__price--rent { color:var(--byn-success) }
.byn-pcard__title { font-size:14px; font-weight:600; color:var(--byn-dark); margin-bottom:8px; line-height:1.4 }
.byn-pcard__loc { font-size:12.5px; color:var(--byn-gray); display:flex; align-items:center; gap:5px; margin-bottom:14px }
.byn-pcard__specs { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1.5px solid var(--byn-border); border-radius:11px; overflow:hidden; margin-bottom:14px }
.byn-pcard__spec { padding:10px 6px; text-align:center; border-right:1.5px solid var(--byn-border) }
.byn-pcard__spec:last-child { border-right:none }
.byn-pcard__spec strong { display:block; font-size:13px; font-weight:800; color:var(--byn-dark) }
.byn-pcard__spec span { font-size:10.5px; color:var(--byn-gray); font-weight:500 }
.byn-pcard__agent { display:flex; align-items:center; gap:10px; padding-top:14px; border-top:1.5px solid var(--byn-border) }
.byn-pcard__agent-avatar { width:32px; height:32px; border-radius:10px; display:grid; place-items:center; color:#fff; font-size:11px; font-weight:800; flex-shrink:0 }
.byn-pcard__agent-name strong { display:block; font-size:13px; font-weight:700; color:var(--byn-dark) }
.byn-pcard__agent-name span { font-size:11px; color:var(--byn-gray) }

/* --- Actor Cards --- */
.byn-act-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px }
.byn-act-card {
  border:1.5px solid var(--byn-border); border-radius:var(--byn-radius-lg);
  padding:30px 22px; transition:.3s; cursor:pointer;
  position:relative; overflow:hidden; background:#fff;
}
.byn-act-card:hover { border-color:rgba(93,65,255,.3); transform:translateY(-5px); box-shadow:0 20px 50px rgba(93,65,255,.1) }
.byn-act-card__icon { width:54px; height:54px; background:var(--byn-primary-light); border-radius:14px; display:grid; place-items:center; font-size:26px; margin-bottom:20px; transition:.3s }
.byn-act-card:hover .byn-act-card__icon { background:linear-gradient(135deg,var(--byn-primary),var(--byn-primary-2)); box-shadow:0 8px 20px rgba(93,65,255,.35) }
.byn-act-card__title { font-size:15.5px; font-weight:800; color:var(--byn-dark); margin-bottom:8px }
.byn-act-card__desc { font-size:13px; color:var(--byn-gray); line-height:1.65; margin-bottom:18px }
.byn-act-card__link { font-size:13px; color:var(--byn-primary); font-weight:700; display:flex; align-items:center; gap:5px; opacity:0; transition:.2s; transform:translateX(-6px) }
.byn-act-card:hover .byn-act-card__link { opacity:1; transform:translateX(0) }

/* --- Tool Cards --- */
.byn-tools-wrap { display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:20px }
.byn-tool-card { border-radius:22px; padding:38px; position:relative; overflow:hidden; display:flex; flex-direction:column; min-height:300px }
.byn-tool-card--purple { background:linear-gradient(145deg,#4730d4 0%,var(--byn-primary) 50%,var(--byn-primary-2) 100%); color:#fff }
.byn-tool-card--dark { background:linear-gradient(145deg,#0a0e1a,var(--byn-dark)); color:#fff; border:1px solid rgba(255,255,255,.07) }
.byn-tool-card--white { background:#fff; border:1.5px solid var(--byn-border); color:var(--byn-dark) }
.byn-tool-card__bg { position:absolute; top:-30px; right:-30px; font-size:100px; opacity:.1; line-height:1; transition:.3s }
.byn-tool-card:hover .byn-tool-card__bg { transform:scale(1.1) rotate(5deg) }
.byn-tool-card__tag { font-size:10.5px; font-weight:800; letter-spacing:1px; text-transform:uppercase; opacity:.6; margin-bottom:12px }
.byn-tool-card h3 { font-size:22px; font-weight:900; letter-spacing:-.5px; line-height:1.2; margin-bottom:12px }
.byn-tool-card p { font-size:13.5px; line-height:1.68; opacity:.75; margin-bottom:24px; flex:1 }

/* --- City Cards --- */
.byn-cities-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
.byn-city-card {
  border-radius:16px; padding:28px 22px; border:1.5px solid var(--byn-border);
  background:#fff; cursor:pointer; transition:.3s; position:relative; overflow:hidden;
  display:flex; flex-direction:column; gap:6px;
}
.byn-city-card::before { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--byn-primary),var(--byn-primary-2)); transform:scaleX(0); transition:.3s; transform-origin:left }
.byn-city-card:hover { border-color:rgba(93,65,255,.25); transform:translateY(-4px); box-shadow:0 16px 40px rgba(93,65,255,.1) }
.byn-city-card:hover::before { transform:scaleX(1) }
.byn-city-card__emoji { font-size:32px; margin-bottom:6px }
.byn-city-card__name { font-size:16px; font-weight:800; color:var(--byn-dark) }
.byn-city-card__count { font-size:13px; color:var(--byn-gray); font-weight:500 }
.byn-city-card__types { display:flex; gap:5px; margin-top:8px; flex-wrap:wrap }
.byn-city-card__type { font-size:10.5px; background:var(--byn-primary-light); color:var(--byn-primary); padding:3px 9px; border-radius:50px; font-weight:600 }

/* --- Promo Banner --- */
.byn-promo {
  background:linear-gradient(135deg,#1a0a3d 0%,var(--byn-dark) 50%,#0a1628 100%);
  border-radius:var(--byn-radius-xl); margin:0 5%; padding:56px 5%;
  display:flex; align-items:center; justify-content:space-between;
  gap:40px; position:relative; overflow:hidden;
  border:1px solid rgba(93,65,255,.2);
}
.byn-promo::before { content:''; position:absolute; top:-80px; left:-80px; width:300px; height:300px; background:radial-gradient(circle,rgba(93,65,255,.3),transparent 70%) }
.byn-promo h3 { font-size:clamp(22px,3vw,34px); font-weight:900; color:#fff; letter-spacing:-1px; margin-bottom:12px; position:relative; z-index:1 }
.byn-promo p { color:#4B5563; font-size:15px; line-height:1.65; max-width:480px; position:relative; z-index:1 }
.byn-promo__actions { display:flex; gap:12px; flex-shrink:0; position:relative; z-index:1 }

/* --- Listing Page --- */
.byn-listing-hero {
  background:linear-gradient(160deg,#0f0729,#060a14);
  padding:36px 5% 0; border-bottom:1px solid rgba(255,255,255,.06);
}
.byn-listing-hero__top { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:24px }
.byn-listing-hero__title { font-size:26px; font-weight:900; color:#fff; letter-spacing:-.5px }
.byn-listing-hero__count { font-size:14px; color:#4B5563; margin-top:4px }
.byn-listing-hero__count em { color:var(--byn-primary-2); font-style:normal; font-weight:700 }
.byn-listing-hero__views { display:flex; gap:6px }
.byn-view-btn { width:36px; height:36px; border-radius:8px; border:1.5px solid rgba(255,255,255,.1); background:transparent; color:rgba(255,255,255,.5); cursor:pointer; display:grid; place-items:center; font-size:14px; transition:.2s }
.byn-view-btn.on { background:rgba(93,65,255,.2); border-color:rgba(93,65,255,.4); color:var(--byn-primary-2) }

/* --- Filters --- */
.byn-filters { background:rgba(255,255,255,.04); border-top:1px solid rgba(255,255,255,.06); padding:16px 0 }
.byn-filters__inner { display:flex; gap:8px; align-items:center; flex-wrap:wrap }
.byn-type-tabs { display:flex; gap:4px; background:rgba(255,255,255,.06); border-radius:10px; padding:4px }
.byn-type-tab { padding:7px 14px; border-radius:7px; font-size:13px; font-weight:600; color:rgba(255,255,255,.5); cursor:pointer; transition:.2s; border:none; background:transparent; font-family:var(--byn-font) }
.byn-type-tab.on { background:var(--byn-primary); color:#fff; box-shadow:0 4px 12px rgba(93,65,255,.35) }

/* --- Dropdown filters --- */
.byn-fdd { position:relative }
.byn-fdd__btn { display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:8px; border:1.5px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04); color:rgba(255,255,255,.7); font-size:13px; font-weight:600; cursor:pointer; transition:.2s; white-space:nowrap }
.byn-fdd__btn:hover { border-color:rgba(93,65,255,.4); background:rgba(93,65,255,.1); color:#fff }
.byn-fdd__menu { position:absolute; top:calc(100% + 8px); left:0; min-width:200px; background:#1a1f2e; border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:8px; box-shadow:0 20px 50px rgba(0,0,0,.4); z-index:50; display:none }
.byn-fdd__menu.open { display:block }
.byn-fdd__item { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:8px; font-size:13px; color:rgba(255,255,255,.6); cursor:pointer; transition:.2s; font-weight:500 }
.byn-fdd__item:hover { background:rgba(93,65,255,.15); color:#fff }

/* --- Sort Bar --- */
.byn-sort-bar { padding:16px 5%; display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1.5px solid var(--byn-border) }
.byn-sort-bar__count { font-size:14px; font-weight:600; color:var(--byn-dark) }
.byn-sort-bar__count em { color:var(--byn-primary); font-style:normal }

/* --- Gallery (fiche bien) --- */
.byn-gallery { position:relative; height:500px; background:var(--byn-dark); overflow:hidden; cursor:pointer }
.byn-gallery__main { width:100%; height:100%; object-fit:cover }
.byn-gallery__grid { position:absolute; top:12px; right:12px; display:grid; grid-template-columns:1fr 1fr; gap:8px; width:260px; height:180px }
.byn-gallery__thumb { border-radius:10px; overflow:hidden; border:2px solid rgba(255,255,255,.15); cursor:pointer; transition:.2s; background-size:cover; background-position:center }
.byn-gallery__thumb:hover { border-color:var(--byn-primary); transform:scale(1.02) }
.byn-gallery__more { position:relative }
.byn-gallery__more::after { content:'+ photos'; position:absolute; inset:0; background:rgba(0,0,0,.6); display:grid; place-items:center; color:#fff; font-size:13px; font-weight:700 }
.byn-gallery__bdgs { position:absolute; top:20px; left:20px; display:flex; gap:8px }
.byn-gallery__actions { position:absolute; bottom:20px; right:20px; display:flex; gap:10px }
.byn-gallery__act { width:40px; height:40px; background:rgba(255,255,255,.12); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.2); border-radius:10px; display:grid; place-items:center; cursor:pointer; font-size:16px; transition:.2s }
.byn-gallery__act:hover { background:rgba(255,255,255,.22) }

/* --- Property layout --- */
.byn-prop-layout { display:grid; grid-template-columns:1fr 360px; gap:28px; max-width:1200px; margin:0 auto; padding:32px 5% }
.byn-prop-sidebar { position:sticky; top:80px }

/* --- Agent card sidebar --- */
.byn-agent-card { background:#fff; border-radius:var(--byn-radius-lg); padding:24px; border:1.5px solid var(--byn-border); margin-bottom:16px }
.byn-agent-card__top { display:flex; align-items:center; gap:14px; margin-bottom:20px }
.byn-agent-card__avatar { width:58px; height:58px; border-radius:14px; display:grid; place-items:center; color:#fff; font-size:20px; font-weight:900; flex-shrink:0 }
.byn-agent-card__name strong { display:block; font-size:16px; font-weight:800; color:var(--byn-dark) }
.byn-agent-card__name span { font-size:12px; color:var(--byn-gray) }
.byn-agent-card__kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:20px }
.byn-agent-card__kpi { background:var(--byn-bg-soft); border-radius:10px; padding:12px 8px; text-align:center }
.byn-agent-card__kpi-n { font-size:19px; font-weight:900; color:var(--byn-dark) }
.byn-agent-card__kpi-l { font-size:10px; color:var(--byn-gray); font-weight:600; text-transform:uppercase; margin-top:2px }

/* --- Price card --- */
.byn-price-card {
  background:linear-gradient(135deg,#1a0f3d,var(--byn-dark));
  border-radius:var(--byn-radius-lg); padding:20px; margin-bottom:16px;
}
.byn-price-card__label { font-size:10px; font-weight:800; letter-spacing:.8px; color:rgba(255,255,255,.4); text-transform:uppercase; margin-bottom:8px }
.byn-price-card__price { font-size:30px; font-weight:900; color:#fff; letter-spacing:-1px; margin-bottom:4px }
.byn-price-card__m2 { font-size:13px; color:rgba(255,255,255,.4); margin-bottom:16px }
.byn-price-card__row { display:flex; justify-content:space-between; font-size:12.5px; padding:8px 0; border-top:1px solid rgba(255,255,255,.07); color:rgba(255,255,255,.5) }
.byn-price-card__row strong { color:rgba(255,255,255,.85); font-weight:700 }

/* --- Auth pages --- */
.byn-auth-page { display:grid; grid-template-columns:1fr 1fr; min-height:100vh }
.byn-auth-left {
  background:linear-gradient(160deg,#0f0729 0%,#060a14 60%);
  padding:48px; display:flex; flex-direction:column; position:relative; overflow:hidden;
}
.byn-auth-left::before { content:''; position:absolute; top:-100px; left:-100px; width:400px; height:400px; background:radial-gradient(circle,rgba(93,65,255,.25),transparent 70%) }
.byn-auth-left::after  { content:''; position:absolute; bottom:-80px; right:-80px; width:300px; height:300px; background:radial-gradient(circle,rgba(139,114,255,.15),transparent 70%) }
.byn-auth-left h1 { font-size:38px; font-weight:900; line-height:1.1; letter-spacing:-1.5px; margin-bottom:16px; color:#fff }
.byn-auth-left h1 span { background:linear-gradient(135deg,#a78bff,var(--byn-primary)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text }
.byn-auth-left p { color:#4B5563; font-size:15px; line-height:1.7; margin-bottom:36px }
.byn-auth-right { background:#fff; padding:48px; display:flex; flex-direction:column; overflow-y:auto }

/* --- Profile cards (auth) --- */
.byn-profile-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:28px }
.byn-profile-card { border:2px solid var(--byn-border); border-radius:14px; padding:16px; cursor:pointer; transition:.25s; position:relative; background:#fff }
.byn-profile-card:hover { border-color:rgba(93,65,255,.3); background:#FAFAFF; transform:translateY(-2px) }
.byn-profile-card.selected { border-color:var(--byn-primary); background:#F5F3FF; box-shadow:0 0 0 3px rgba(93,65,255,.1) }
.byn-profile-card__icon { font-size:26px; margin-bottom:8px }
.byn-profile-card__name { font-size:13.5px; font-weight:800; color:var(--byn-dark); margin-bottom:3px }

/* --- Responsive components --- */
@media (max-width:768px) {
  .byn-prop-grid { grid-template-columns:1fr }
  .byn-act-grid { grid-template-columns:1fr 1fr }
  .byn-tools-wrap { grid-template-columns:1fr }
  .byn-cities-grid { grid-template-columns:1fr 1fr }
  .byn-promo { flex-direction:column; text-align:center }
  .byn-search__row { flex-direction:column }
  .byn-search__div { display:none }
  .byn-auth-page { grid-template-columns:1fr }
  .byn-auth-left { display:none }
  .byn-prop-layout { grid-template-columns:1fr }
  .byn-prop-sidebar { position:relative; top:0 }
  .byn-gallery { height:300px }
  .byn-gallery__grid { display:none }
}
@media (max-width:480px) {
  .byn-act-grid { grid-template-columns:1fr }
  .byn-cities-grid { grid-template-columns:1fr }
  .byn-profile-grid { grid-template-columns:1fr }
}