/* ---------- Tokens & scoped reset ---------- */
.a1-roam {
  --roam-red: #EB140A;
  --roam-red-alt: #FF372D;
  --roam-red-dark: #B90A05;
  --roam-violet: #4321e0;
  --roam-black: #000;
  --roam-white: #fff;
  --roam-gray-15: #f7f7f7;
  --roam-gray-20: #efefef;
  --roam-gray-30: #d7d7d7;
  --roam-gray-60: #585858;
  --roam-gray-70: #666;
  --roam-gray-90: #333;
  --roam-container: 1200px;
  --roam-ease: ease-in-out;
  --roam-fast: 200ms;

  font-size: 16px;
  line-height: 1.5;
  color: var(--roam-black);
  background: var(--roam-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.a1-roam *,
.a1-roam *::before,
.a1-roam *::after { box-sizing: border-box; }
.a1-roam h1, .a1-roam h2, .a1-roam h3, .a1-roam h4, .a1-roam p { margin: 0; color: inherit; letter-spacing: normal; text-transform: none; }
.a1-roam h1, .a1-roam h2, .a1-roam h3, .a1-roam h4, .a1-roam b, .a1-roam strong, .a1-roam em { font-weight: normal; font-style: normal; }
.a1-roam ul { margin: 0; padding: 0; list-style: none; }
.a1-roam a:hover, .a1-roam a:focus { text-decoration: none; }
.a1-roam button { margin: 0; font-family: inherit; }
.a1-roam [hidden] { display: none !important; }
.a1-roam :focus-visible { outline: 2px solid var(--roam-violet); outline-offset: 2px; }

.a1-roam .roam-container { max-width: var(--roam-container); margin: 0 auto; padding: 0 24px; }

.a1-roam .roam-title {
  font-size: 22px;
  line-height: 1.25;
  color: var(--roam-black);
}

.a1-roam .roam-ico {
  display: block;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background: no-repeat center / contain;
}

/* ---------- Hero ---------- */
.a1-roam .roam-hero {
  position: relative;
  min-height: 440px;
  display: flex;
  align-items: center;
  background: #2a1a3a url("https://www.a1.mk/documents/20126/1205200/Roaming_Hero_Banner.png") center -200px / cover no-repeat;
}
.a1-roam .roam-hero::before {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.35) 45%, rgba(0,0,0,0) 75%);
}
.a1-roam .roam-hero__inner { position: relative; width: 100%; padding-top: 56px; padding-bottom: 48px; }
.a1-roam .roam-hero__title {
  margin-bottom: 18px;
  font-size: clamp(40px, 5vw, 60px);
  line-height: 1.05;
  color: var(--roam-white);
}
.a1-roam .roam-hero__lead { max-width: 560px; font-size: 20px; line-height: 1.5; color: var(--roam-white); text-wrap: pretty; }
.a1-roam .roam-hero__features {
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}
.a1-roam .roam-feature {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 24px;
  border-radius: 12px;
  background: rgba(255,255,255,.85);
}
.a1-roam .roam-feature .roam-ico { width: 32px; height: 32px; }
.a1-roam .roam-feature__title { margin-bottom: 6px; font-size: 18px; line-height: 1.25; }
.a1-roam .roam-feature__text { font-size: 15px; line-height: 1.45; color: var(--roam-gray-90); }

/* ---------- Customer type + package tabs ---------- */
.a1-roam .roam-picker { padding: 64px 0 32px; background: var(--roam-white); }
.a1-roam .roam-picker__head { display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; }

.a1-roam .roam-segs { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
.a1-roam .roam-seg {
  height: 56px;
  padding: 0 38px;
  border: 1px solid #e3dde8;
  border-radius: 6px;
  background: var(--roam-white);
  color: var(--roam-gray-90);
  font-size: 18px;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color var(--roam-fast) var(--roam-ease), background-color var(--roam-fast) var(--roam-ease);
}
.a1-roam .roam-seg:hover { border-color: var(--roam-red); }
.a1-roam .roam-seg[aria-pressed="true"] { border-color: var(--roam-red); background: var(--roam-red); color: var(--roam-white); }

.a1-roam .roam-title--tabs { margin: 48px 0 20px; text-align: center; }
.a1-roam .roam-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px 12px;
}
.a1-roam .roam-tabs__item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 0 1 calc((100% - 24px) / 3); /* 3 во ред */
  min-width: 0;
}
.a1-roam .roam-tab {
  height: 56px;
  padding: 0 20px;
  border: 1px solid var(--roam-gray-30);
  border-radius: 6px;
  background: var(--roam-white);
  color: var(--roam-black);
  font-size: 18px;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color var(--roam-fast) var(--roam-ease), background-color var(--roam-fast) var(--roam-ease);
}
.a1-roam .roam-tab:hover { border-color: var(--roam-violet); }
.a1-roam .roam-tab[aria-selected="true"] { border-color: var(--roam-violet); background: var(--roam-violet); color: var(--roam-white); }
.a1-roam .roam-tabs__hint { padding: 0 4px; font-size: 14px; color: var(--roam-gray-60); text-align: center; }

/* ---------- Package panels ---------- */
.a1-roam .roam-packages { padding: 48px 0 56px; background: var(--roam-gray-15); }
.a1-roam .roam-panel__head { margin-bottom: 24px; }
.a1-roam .roam-panel__head .roam-title { margin-bottom: 8px; }
.a1-roam .roam-panel__lead { max-width: 720px; font-size: 17px; line-height: 1.55; color: var(--roam-gray-60); text-wrap: pretty; }

.a1-roam .roam-pkgs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}
.a1-roam .roam-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 28px 24px 24px;
  border-radius: 12px;
  background: var(--roam-white);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}
.a1-roam .roam-card__name { margin-bottom: 20px; font-size: 22px; line-height: 1.2; }
.a1-roam .roam-card__rows { display: flex; flex-direction: column; gap: 16px; flex-grow: 1; }
.a1-roam .roam-card__row { display: flex; align-items: center; gap: 14px; }
.a1-roam .roam-card__row > div { flex: 1; min-width: 0; }
.a1-roam .roam-card__value { display: block; font-size: 18px; line-height: 1.3; color: var(--roam-red); }
.a1-roam .roam-card__label { display: block; font-size: 14px; line-height: 1.35; color: var(--roam-gray-60); }

.a1-roam .roam-card__foot { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--roam-gray-20); }
.a1-roam .roam-card__pdf {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 14px;
  color: var(--roam-violet);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity var(--roam-fast) var(--roam-ease);
}
.a1-roam .roam-card__pdf:hover,
.a1-roam .roam-card__pdf:focus { color: var(--roam-violet); text-decoration: underline; opacity: .8; }
.a1-roam .roam-card__pdf .roam-ico { width: 18px; height: 18px; }

.a1-roam .roam-card__price { display: flex; flex-direction: column; gap: 4px; margin-bottom: 18px; }
.a1-roam .roam-card__price small { font-size: 14px; color: var(--roam-gray-60); }
.a1-roam .roam-card__price strong { font-size: 30px; line-height: 1.2; white-space: nowrap; color: var(--roam-red); }
.a1-roam .roam-card__price em { font-size: 16px; }

.a1-roam .roam-btn {
  display: flex;
  align-items: center;
  border: 1px solid var(--roam-red);
  border-radius: 8px;
  background: var(--roam-red);
  color: var(--roam-white);
  line-height: 1.2;
  text-decoration: none;
  transition: background-color var(--roam-fast) var(--roam-ease), border-color var(--roam-fast) var(--roam-ease);
}
.a1-roam .roam-btn:hover,
.a1-roam .roam-btn:focus { border-color: var(--roam-red-alt); background: var(--roam-red-alt); color: var(--roam-white); }
.a1-roam .roam-btn:active { border-color: var(--roam-red-dark); background: var(--roam-red-dark); }

.a1-roam .roam-card__cta {
  position: relative;
  justify-content: center;
  min-height: 48px;
  padding: 12px 44px;
  font-size: 16px;
  text-align: center;
}
.a1-roam .roam-card__cta svg { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); }
.a1-roam .roam-card__sms { margin-top: 10px; font-size: 13px; color: var(--roam-gray-60); text-align: center; }
.a1-roam .roam-card__sms b { color: var(--roam-black); }

/* ---------- How it works ---------- */
.a1-roam .roam-how { background: var(--roam-gray-15); }
.a1-roam .roam-how__box {
  padding: clamp(32px, 4vw, 48px);
  border-radius: 12px;
  background: linear-gradient(120deg, #da291c 0%, #e04a1e 55%, #e85c20 100%);
  box-shadow: 0 12px 32px rgba(0,0,0,.12);
  color: var(--roam-white);
}
.a1-roam .roam-how__box .roam-title { margin-bottom: 32px; color: var(--roam-white); }
.a1-roam .roam-how__steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 32px 48px;
}
.a1-roam .roam-how__step { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.a1-roam .roam-how__step h3 { font-size: 20px; line-height: 1.25; text-wrap: balance; }
.a1-roam .roam-how__step p { font-size: 16px; line-height: 1.55; text-wrap: pretty; }
.a1-roam .roam-how__step b { color: var(--roam-white); }

/* ---------- A1 Net Sef ---------- */
.a1-roam .roam-netsef { padding-top: 56px; background: var(--roam-gray-15); }
.a1-roam .roam-netsef__box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px 48px;
  padding: clamp(28px, 4vw, 48px) clamp(24px, 4vw, 56px);
  border-radius: 12px;
  background: var(--roam-white);
  box-shadow: 0 12px 32px rgba(0,0,0,.08);
}
.a1-roam .roam-netsef__text { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.a1-roam .roam-netsef__text .roam-title { text-wrap: balance; }
.a1-roam .roam-netsef__text p { max-width: 640px; font-size: 17px; line-height: 1.55; color: var(--roam-gray-70); text-wrap: pretty; }
.a1-roam .roam-netsef__cta { gap: 14px; min-height: 48px; margin-top: 16px; padding: 12px 24px; font-size: 17px; }
.a1-roam .roam-netsef__img { flex-shrink: 0; width: 170px; height: auto; margin-right: clamp(0px, 4vw, 64px); }

/* ---------- FAQ ---------- */
.a1-roam .roam-faq { padding: 64px 0 80px; background: var(--roam-gray-15); }
.a1-roam .roam-faq .roam-title { margin-bottom: 16px; }
.a1-roam .roam-faq__item { border-bottom: 1px solid var(--roam-black); }
.a1-roam .roam-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 0;
  list-style: none;
  cursor: pointer;
  font-size: clamp(18px, 1.6vw, 21px);
  line-height: 1.35;
  color: var(--roam-black);
}
.a1-roam .roam-faq__q::-webkit-details-marker { display: none; }
.a1-roam .roam-faq__q::marker { content: ""; }
.a1-roam .roam-faq__icon { flex-shrink: 0; font-size: 28px; line-height: 1; }
.a1-roam .roam-faq__icon::before { content: "+"; }
.a1-roam .roam-faq__item[open] .roam-faq__icon::before { content: "\2212"; }
.a1-roam .roam-faq__a { margin-top: -8px; padding: 0 48px 28px 0; font-size: 16px; line-height: 1.6; color: var(--roam-gray-60); text-wrap: pretty; }

@media (max-width: 991px) {
  .a1-roam .roam-tabs__item { flex-basis: calc((100% - 12px) / 2); } /* 2 во ред */
}

@media (max-width: 767px) {
  .a1-roam .roam-hero { background-position: center; }
  .a1-roam .roam-faq__a { padding-right: 0; }
  .a1-roam .roam-tabs__item { flex-basis: 100%; } /* 1 во ред на мобилен */
  .a1-roam .roam-tab { white-space: normal; height: auto; min-height: 56px; padding: 10px 16px; }
}

/* ---------- Icons (inlined so nothing has to be uploaded to Documents and Media) ---------- */
.a1-roam .roam-ico--data { background-image: url("data:image/svg+xml,%3Csvg fill='%23ec3024' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520.87 372.05'%3E%3Cpath d='M130.218,0H37.205v37.205H0v241.833l37.205,93.012h427.858V37.205H130.218V0z M483.665,74.41v260.435 L520.87,74.41L483.665,74.41L483.665,74.41z'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--zone { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 458.97 595.28'%3E%3Cpath fill='%23DA291C' d='M261.551,259.667l43.786,43.693L458.97,151.61L305.337,0l-43.786,43.693l76.224,75.759H152.168v64.458 h185.607L261.551,259.667z M197.419,335.612l-43.786-43.693L0,443.646L153.633,595.28l43.786-43.693l-76.224-75.759h185.606v-64.434 H121.195L197.419,335.612z'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--call { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 483.665 409.255'%3E%3Cpath fill='%23DA291C' d='M409.256,0H74.41L0,74.41v167.422l74.41,74.41h260.435v93.013h37.205l111.615-93.013V74.41L409.256,0z M446.461,297.64l-74.41,55.807v-74.41H93.013L37.205,223.23V93.012l55.808-55.808h297.64l55.807,55.808L446.461,297.64 L446.461,297.64z M223.231,260.435h37.205V223.23h-37.205L223.231,260.435L223.231,260.435z M279.038,55.807h-74.41l-37.205,37.205 v37.205h37.205v-18.603l18.603-18.602h37.205l18.602,18.602v18.603l-18.602,18.603h-37.205v55.807h37.205v-18.603h18.602 l37.205-37.205V93.012L279.038,55.807z'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--sms { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 409.255 297.64'%3E%3Cpath fill='%23DA291C' d='M0,0h74.41v74.41H0V0z M111.615,0h297.64v74.41h-297.64L111.615,0L111.615,0z M0,111.615h74.41v74.41H0V111.615z M111.615,111.615h297.64v74.41h-297.64L111.615,111.615L111.615,111.615z M0,223.23h74.41v74.41H0V223.23z M111.615,223.23h297.64 v74.41h-297.64L111.615,223.23L111.615,223.23z'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--ok { background-image: url("data:image/svg+xml,%3Csvg fill='%23ec3024' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpolygon points='30 8 28 6 12 20 4 14 2 16 12 26 30 8'%3E%3C/polygon%3E%3C/svg%3E"); }
.a1-roam .roam-ico--check { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M23.7072 11.7072L14.0001 21.4143L8.29297 15.7072L9.70718 14.293L14.0001 18.5859L22.293 10.293L23.7072 11.7072Z' fill='black'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--roaming { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25.3596 6.64328C23.6204 4.90401 21.4006 3.822 19.0001 3.51469L19 1.5C21.9358 1.81678 24.6561 3.11142 26.7738 5.22914C28.8949 7.35025 30.1905 10.0758 30.5046 13.0171L28.4898 13.0171C28.185 10.6111 27.1024 8.38602 25.3596 6.64328Z' fill='black'%3E%3C/path%3E%3Cpath d='M26.2512 13.017H24.241C24.0905 11.7207 23.5236 10.4639 22.5313 9.47164C21.5426 8.48296 20.2913 7.91714 19.0001 7.76412V5.75198C20.8055 5.91178 22.5666 6.67857 23.9455 8.05742C25.3279 9.43982 26.0941 11.2067 26.2512 13.017Z' fill='black'%3E%3C/path%3E%3Cpath d='M21.117 10.8859C20.524 10.2929 19.7735 9.95452 19.0001 9.86854V11.5974L20.398 12.9953L22.1336 12.9953C22.0463 12.2246 21.7081 11.477 21.117 10.8859Z' fill='black'%3E%3C/path%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 16C4 9.37258 9.37258 4 16 4V6.00005C14.6946 7.56749 13.6999 9.22875 13.0526 11H16V13H12.481C12.2789 13.9686 12.1752 14.9688 12.1752 16.003C12.1752 17.0355 12.2788 18.0337 12.4804 19H19.5191C19.721 18.0323 19.8247 17.0331 19.8249 16H22C21.9999 17.0338 21.9061 18.0326 21.723 19H25.5422C25.8396 18.053 26 17.0452 26 16H28C28 17.7079 27.6432 19.3325 27 20.8033V21H26.9119C25.0159 25.1311 20.843 28 16 28C9.37258 28 4 22.6274 4 16ZM13.1647 25.5924C12.1287 24.1369 11.3309 22.6127 10.7956 21H7.33782C8.60681 23.1937 10.6852 24.8606 13.1647 25.5924ZM6.4578 19H10.2766C10.0937 18.0339 10 17.0361 10 16.003C10 14.9682 10.0938 13.9684 10.2771 13H6.4578C6.16035 13.947 6 14.9548 6 16C6 17.0452 6.16035 18.053 6.4578 19ZM7.33782 11H10.7956C11.3301 9.38817 12.1265 7.86397 13.1617 6.40854C10.6835 7.14074 8.6063 8.80718 7.33782 11ZM16 26C17.3054 24.4325 18.3001 22.7713 18.9475 21H13.0522C13.7002 22.7718 14.6956 24.4326 16 26ZM18.8385 25.5914C21.3166 24.8592 23.3937 23.1928 24.6622 21H21.2045C20.67 22.6118 19.8737 24.136 18.8385 25.5914Z' fill='black'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--netcube { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.0155 3.9999C16.5558 3.9999 14.2211 4.8044 12.3064 6.2845L10.8817 4.86C13.1816 3.0081 16.0206 2 19.0155 2C22.0152 2 24.8586 3.0111 27.1605 4.8688L25.7358 6.2935C23.819 4.8078 21.4801 3.9999 19.0155 3.9999Z' fill='black'%3E%3C/path%3E%3Cpath d='M24.1528 7.8764L22.7314 9.2978C21.7084 8.4876 20.4188 7.9998 19.0155 7.9998C17.6173 7.9998 16.3324 8.4845 15.3112 9.2893L13.8884 7.8665C15.278 6.7029 17.0655 5.9998 19.0155 5.9998C20.9705 5.9998 22.7617 6.7074 24.1528 7.8764Z' fill='black'%3E%3C/path%3E%3Cpath d='M19.0155 9.9999C18.1769 9.9999 17.4069 10.2913 16.7992 10.7774L18.0217 11.9999H19.9986L21.2259 10.7726C20.6192 10.2894 19.8514 9.9999 19.0155 9.9999Z' fill='black'%3E%3C/path%3E%3Cpath d='M11 8.00001H10.331C8.9746 8.00001 7.85724 9.03555 7.79248 10.3527L7.00296 26.4115C6.93368 27.8206 8.09026 29 9.5415 29H19.4585C20.9097 29 22.0663 27.8206 21.997 26.4115L21.3868 14H19.3514L19.9662 26.5058C19.9801 26.7877 19.7487 27.0235 19.4585 27.0235H9.5415C9.25125 27.0235 9.01993 26.7877 9.03379 26.5058L9.82331 10.447C9.83627 10.1836 10.0597 9.97648 10.331 9.97648H12.9765L11 8.00001Z' fill='black'%3E%3C/path%3E%3Cpath d='M13 19H11V21H13V19Z' fill='black'%3E%3C/path%3E%3Cpath d='M13 23H11V25H13V23Z' fill='black'%3E%3C/path%3E%3C/svg%3E"); }
.a1-roam .roam-ico--info { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 128 128' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M69 38V47.4H60V38H69Z' fill='%234321e0'%3E%3C/path%3E%3Cpath d='M69 56.8V85H60V56.8H69Z' fill='%234321e0'%3E%3C/path%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M113 63.5C113 90.2858 91.2858 112 64.5 112C37.7142 112 16 90.2858 16 63.5C16 36.7142 37.7142 15 64.5 15C91.2858 15 113 36.7142 113 63.5ZM105 63.5C105 85.8675 86.8675 104 64.5 104C42.1325 104 24 85.8675 24 63.5C24 41.1325 42.1325 23 64.5 23C86.8675 23 105 41.1325 105 63.5Z' fill='%234321e0'%3E%3C/path%3E%3C/svg%3E"); }
