@font-face{font-family:Highman;src:url("assets/Highman.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url("assets/inter.ttf") format("truetype");font-weight:100 900;font-display:swap}
:root{color-scheme:light;--ink:#111;--orange:#f46823;--accent:#a63d0b;--muted:#595959;--display:Highman,Impact,"Arial Narrow",sans-serif;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff}
*{box-sizing:border-box}
body{margin:0}
a{color:inherit}
button,input{font:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid #205bb6;outline-offset:4px}
[hidden]{display:none!important}
.shell{width:min(1312px,calc(100% - 128px));margin-inline:auto}
.header{height:105px;display:grid;grid-template-columns:202px 1fr;align-items:center;gap:36px;position:relative;z-index:2}
.brand{display:inline-flex;align-items:center;width:fit-content}
.brand img{display:block;width:185px;height:auto}
.navigation{display:grid;grid-template-columns:1fr 209px;align-items:center}
.nav-links{display:flex;justify-content:center;gap:52px;margin-left:-34px}
.nav-links a,.tracking-link,.topics nav > a{text-decoration:none}
.nav-links a:hover,.tracking-link:hover,.topics nav > a:hover{text-decoration:underline}
.nav-links a,.button{font-size:16px}
.button{display:inline-flex;align-items:center;justify-content:center;width:max-content;min-height:53px;padding:12px 28px;background:var(--orange);color:#15100b;font-weight:650;border-radius:9px;text-decoration:none}
.button:hover{background:#ff7d3c}
.navigation>.button{width:209px}
.menu-button,.mobile-contact{display:none}
.hero{position:relative;display:grid;min-height:clamp(360px,42vw,600px);place-items:center;margin-top:79px;border-radius:8px;text-align:center;color:#fff;background:linear-gradient(#0009,#0009),url("assets/support-photo.png") center 52%/cover no-repeat,#241911}
.hero-content{width:min(100%,892px);padding:32px;transform:translateY(clamp(20px,2.57vw,37px))}
h1,h2{font-family:var(--display);font-weight:400;line-height:1.05;text-transform:uppercase;margin:0}
h1{font-size:clamp(55px,9.03vw,130px);line-height:1.05;letter-spacing:0}
h2{font-size:clamp(35px,4.44vw,64px)}
.search{width:min(100%,50.55vw,728px);margin:23px auto 0;position:relative;color:var(--ink)}
.search-input{min-height:68px;display:flex;align-items:center;justify-content:center;gap:8px;background:#fff;border:1px solid #d9d7d4;border-radius:16px;padding:0 15px}
.search-input button{width:30px;height:36px;padding:4px;border:0;background:none;color:#555}
.search-input svg{display:block;width:24px;height:24px}
.search-input input{min-width:0;width:204px;min-height:56px;border:0;background:transparent;font-size:16px}
.search-input:focus-within input,.search-input:has(input:not(:placeholder-shown)) input{width:100%}
.search-input input::placeholder{color:#6d6d77}
.search-input input:focus{outline:none}
.search-input:focus-within{outline:2px solid #205bb6;outline-offset:3px}
.search-results{position:absolute;inset:calc(100% + 8px) 0 auto;z-index:3;background:#f3f3f4;text-align:left;border-radius:12px;box-shadow:0 10px 32px #0004;overflow:hidden}
.search-results ul{list-style:none;margin:0;padding:8px}
.search-results a,.empty-result{display:block;padding:14px 16px;border-radius:6px}
.search-results a{text-decoration:none}
.search-results a:hover,.search-results a:focus-visible{background:#fff}
.guides{display:grid;grid-template-columns:246px minmax(0,892px);justify-content:center;gap:80px;padding-top:180px;padding-bottom:86px;scroll-margin-top:20px}
.audiences{display:flex;gap:42px;margin-bottom:60px}
.audiences button{border:0;border-bottom:2px solid transparent;background:none;padding:0 0 7px;font-size:16px;color:var(--ink)}
.audiences button[aria-pressed=true]{border-color:var(--orange);font-weight:700}
.topics nav{display:grid;gap:0}
.topics nav > a{display:block;padding:12px 0;font-size:16px;line-height:1.5}
.topics nav > a[aria-current=true]{color:var(--accent);font-weight:650}
.guide-photo{display:block;width:100%;height:134px;object-fit:cover;object-position:center 49%;border-radius:16px;margin-bottom:36px}
.guide-intro{font-size:17px;line-height:1.6;margin:20px 0 38px;color:#323232;max-width:85ch}
.faq{border-radius:15px;background:#f4f4f5;padding:24px 18px}
details{background:#fff}
details+details{border-top:1px solid #e5e5e6}
summary{display:grid;grid-template-columns:64px 1fr 38px;align-items:start;gap:16px;list-style:none;padding:38px 44px;cursor:pointer;font-weight:750;font-size:21px;line-height:1.35}
summary::-webkit-details-marker{display:none}
.number{font-size:32px;line-height:1;color:#777}
.toggle-icon{height:35px;width:35px;border-radius:50%;background:#f4f4f5;display:grid;place-items:center;font-size:18px;font-weight:400}
.toggle-icon::before{content:"+"}
details[open] .toggle-icon{background:#111;color:#fff}
details[open] .toggle-icon::before{content:"×"}
details p{margin:-9px 44px 0 124px;padding-bottom:38px;max-width:67ch;color:var(--muted);line-height:1.6}
details p a{color:var(--accent)}
.guide-actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:38px}
.tracking-link{font-size:15px;color:var(--accent);font-weight:650}
.popular{background:#101010;color:#fff;padding:106px 0 92px}
.popular h2{font-size:clamp(40px,7.64vw,110px)}
.popular>.shell>p{font-size:17px;line-height:1.55;max-width:62ch;margin:35px 0 74px;color:#eee}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.cards a{display:block;border-radius:14px;overflow:hidden;background:#080808;text-decoration:none}
.cards a:hover strong{text-decoration:underline}
.cards img{width:100%;height:auto;aspect-ratio:638/452;object-fit:cover;display:block}
.cards a>div{padding:18px}
.cards a p{margin:10px 0 0;font-size:14px;line-height:1.5;color:#ddd}
.skip,.sr-only{position:absolute}
.skip{transform:translateY(-130%);background:#fff;padding:10px;z-index:5}
.skip:focus{transform:none}
.sr-only{width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:1160px){.shell{width:calc(100% - 72px)}.guides{grid-template-columns:205px minmax(0,1fr);gap:44px;padding-top:110px}.nav-links{gap:25px}}
@media (max-width: 760px) {
  .shell { width: calc(100% - 50px); }
  .header { display: flex; justify-content: space-between; width: calc(100% - 32px); height: 92px; }
  .brand img { width: 127px; }
  .menu-button { display: flex; width: 40px; height: 40px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 0; background: none; }
  .menu-button span { height: 1px; width: 29px; background: #111; }
  .navigation { display: none; position: absolute; top: 100%; right: 0; left: 0; background: #fff; box-shadow: 0 8px 18px #0002; padding: 18px; border-radius: 8px; }
  .navigation.is-open { display: grid; grid-template-columns: 1fr; gap: 18px; }
  .nav-links { display: grid; justify-content: start; margin: 0; gap: 14px; }

  .hero-shell { width: 100%; }
  .hero {
    margin-top: 18px;
    min-height: clamp(450px, 122.66vw, 525px);
    border-radius: 0;
    background-position: center, center 53%;
    background-size: auto, max(100%, 630px) auto;
  }
  .hero-content { padding: 20px 16px; transform: translateY(-3px); }
  .hero h1 { margin: auto; font-size: clamp(52px, 15.576vw, 66.667px); line-height: 1.05; }
  .hero h1 span { display: block; }
  .search { width: min(100%, 224px); margin-top: 14px; }
  .search-input { min-height: 42px; border-radius: 10px; gap: 4px; padding: 0 8px; }
  .search-input button { width: 26px; height: 36px; }
  .search-input svg { width: 20px; height: 20px; }
  .search-input input { width: 160px; min-height: 40px; font-size: 14px; }

  .guides { display: block; width: calc(100% - 60px); padding: 45px 0 112px; }
  .guides.has-open-guide { padding-bottom: 60px; }
  .audiences { gap: 47px; margin-bottom: 40px; }
  .audiences button { font-size: 18px; line-height: 21px; padding-bottom: 5px; }
  .topics nav > a { display: flex; align-items: center; min-height: 48px; padding: 12px 0; font-size: 16px; line-height: 24px; }
  .topics nav > a[aria-current="true"] { min-height: 32px; padding: 4px 14px; background: #f4f4f5; border-radius: 12px 12px 0 0; }
  .topics .guide { margin-bottom: 12px; padding: 8px 14px 24px; background: #f4f4f5; border-radius: 0 0 12px 12px; }
  .guide-photo { display: none; }
  .guide h2 { font-size: 28px; scroll-margin-top: 20px; }
  .guide-intro { margin: 12px 0 16px; font-size: 16px; line-height: 1.5; }
  .faq { padding: 0; }
  summary { grid-template-columns: 34px 1fr 28px; gap: 10px; padding: 22px 12px; font-size: 16px; }
  .number { font-size: 25px; }
  .toggle-icon { width: 26px; height: 26px; }
  details p { margin: 0 12px 0 56px; padding-bottom: 22px; font-size: 14px; }
  .guide-actions { margin-top: 16px; gap: 12px 18px; }
  .guide-actions a { display: inline-flex; min-height: 44px; padding: 10px 16px; font-size: 14px; line-height: 1.3; }
  .guide-actions .button { min-height: 53px; padding-inline: 24px; }

  .popular { padding: 112px 0; }
  .popular h2 { font-size: 54px; }
  .popular > .shell > p { margin: 24px 0 80px; font-size: 16px; }
  .cards { grid-template-columns: 1fr; gap: 24px; }
  .cards img { aspect-ratio: 378 / 226; }
  .cards a > div { min-height: 133px; padding: 14px; }
  .cards a strong { font-size: 17px; }

  .mobile-contact { display: block; width: min(300px, calc(100% - 50px)); padding: 112px 0; }
  .mobile-contact h2 { font-size: 44px; }
  .mobile-contact p { margin: 24px 0 32px; font-size: 16px; line-height: 1.55; }
  .mobile-contact .mobile-email { margin: 24px 0 0; }
  .mobile-tracking { display: inline-flex; align-items: center; min-height: 44px; margin-left: 12px; }
  .mobile-email a { color: var(--accent); }
}

@media (max-width: 360px) {
  .guides { width: calc(100% - 44px); }
  .popular h2 { font-size: 44px; }
}

.site-footer {
  border-top: 1px solid #e4e5e7;
  background: #fff;
  color: #42454d;
  padding-inline: clamp(24px, 4.45vw, 64px);
  font-family: 'Inter', Arial, Helvetica, sans-serif;
}

.site-footer__inner {
  max-width: 1312px;
  margin-inline: auto;
}

.site-footer__groups {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 32px;
  padding-block: 48px 40px;
}

.site-footer__heading {
  margin: 0 0 16px;
  color: #222325;
  font-family: inherit;
  text-transform: none;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
}

.site-footer__links {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__link {
  color: inherit;
  font-size: 15px;
  line-height: 1.5;
  text-decoration: none;
  text-underline-offset: 3px;
}

.site-footer__link:hover,
.site-footer__link:focus-visible {
  text-decoration: underline;
}

.site-footer__bar,
.site-footer__identity,
.site-footer__social {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.site-footer__bar {
  justify-content: space-between;
  gap: 16px 24px;
  border-top: 1px solid #e4e5e7;
  padding-block: 20px;
}

.site-footer__identity {
  gap: 12px 20px;
}

.site-footer__brand img {
  display: block;
}

.site-footer__copyright {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.site-footer__social {
  gap: 8px;
}

.site-footer__social-link {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 50%;
  color: inherit;
}

.site-footer__social-link:hover,
.site-footer__social-link:focus-visible {
  background: #f1f2f3;
}

.site-footer__icon {
  width: 20px;
  height: 20px;
}

@media (max-width: 900px) {
  .site-footer__groups {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .site-footer__groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 20px;
    padding-block: 32px;
  }

  .site-footer__bar,
  .site-footer__identity {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}
