*,*:before,*:after{box-sizing:border-box}*{margin:0}html,body{height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased;font-family:Nunito Sans,sans-serif;font-display:swap}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;font:inherit}.visually-hidden{border:0;padding:0;margin:0;position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px);clip-path:inset(50%);white-space:nowrap}:root{--light-text: hsl(200, 15%, 8%);--light-bg: hsl(0, 0%, 98%);--light-input: hsl(0, 0%, 52%);--light-element: hsl(0, 0%, 100%);--light-header-shadow: rgb(100 100 111 / 20%) 3px 0px 20px 2px;--light-nav-shadow: rgb(100 100 111 / 20%) 3px 0px 20px 2px;--light-search-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAABEElEQVRIie2UQU7CQBSGP92CO8pJ3CPcAOJBYEHQhQnIhp1H0cA5BA8gZ4DWbrUu3j/SmJTOlNQF8U9eZib9532v7byBc1UbmAMbIFWsgUcgOjX5LZAAWUHEwOCU5F9K9Ax0gIbiBnjRs0+gH5q8nat8fMQ3kWcPtEIAcw6Vl2kp7ywE8KZNHQ9vV951COBDm5oe3it5kzLjZW6eBRRz4WvMA7Yarz32Oc97CGClcegBGGlcenh/FGFNlGFHsUj38uyo0NUDrIkyVdfFfnoT6GFv6Tr6ITS5Ux9roqKrYqfkbj2tAmlhTfSKHd9U8xmHz5KHVoKUyV0ZLhb/kGOa/oLc1Q2J6wCAVR4DT3UB/l7fL7FfCGTteEcAAAAASUVORK5CYII=);--light-filter-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABmJLR0QA/wD/AP+gvaeTAAAAfklEQVRIie2RMQqAMAxF/33scZQOehhH76xQl2YJjU0wdTEPOhT6eKQBguCXTF84O4ALwGZwFgAngMMSKfVoYxQhrxtLTCj1nh+cLDipF5sbojQZn4Terr2IJfY6oom5RQjp/617VNGazG0Sbcw1IsWGRHhsaITIcFh8EIznBmU+WkVTSnR6AAAAAElFTkSuQmCC);--dark-text: hsl(0, 0%, 100%);--dark-bg: hsl(207, 26%, 17%);--dark-input: hsl(200, 15%, 8%);--dark-element: hsl(209, 23%, 22%);--dark-header-shadow: rgb(10 10 12 / 20%) 3px 0px 20px 2px;--dark-nav-shadow: rgb(0 0 0 / 16%) 3px 0px 7px 0px, rgb(0 0 0 / 6%) 0px 0px 0px 1px;--dark-search-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAABCUlEQVRIie2TT44BURCH22yxw0lmb7gBcRAW0iwkemzsHGWEc/hzAM5g/NnyWfh18tKJVm+QSUQllded/qq+SudVELxkACVgACyAg3IOfAPFe5s3gB3XYwvU72l+UqMfoAxklV/AWN+OQM23ecmZvJ3ChWJ+gYKPYBBPbmAnYiMfwVJFZQNbETv3EexVlDOwebG7W+yHW2eeJggyVtAVrHV+GupiZuUjmOpsGgQtnRMDewmgqCUCCFO4rpiN91YDdS0RuooVIKesAlNno3tezR1JTUt0LTZAz3nv/0VSACJgput70HMU/5aE1F9iGCJMSIZvSZqkn5B0ni3ZPlwgSYfLso6eIviXOAMSF92XTUSNpQAAAABJRU5ErkJggg==);--dark-filter-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABmJLR0QA/wD/AP+gvaeTAAAAgElEQVRIie3RTQqAIBCGYe+Txylc1GFadueCt02ChH+D2qb5doIfDzNjjEbzvwDT8A6wAxewCToLcAKHBPGpwgLEJ48B9lXgebtMxyU6toTNkWJ0ssgk/u9a2kI11ozUYN2QAEvtX3THlsn6TCLA+iEZrD8SwcYhAeaaD6/RfJIb4/y0+CfpwpYAAAAASUVORK5CYII=);--ratio: 1.5;--s-6: calc(var(--s-5) / var(--ratio));--s-5: calc(var(--s-4) / var(--ratio));--s-4: calc(var(--s-3) / var(--ratio));--s-3: calc(var(--s-2) / var(--ratio));--s-2: calc(var(--s-1) / var(--ratio));--s-1: calc(var(--s0) / var(--ratio));--s0: 1rem;--s1: calc(var(--s0) * var(--ratio));--s2: calc(var(--s1) * var(--ratio));--s3: calc(var(--s2) * var(--ratio));--s4: calc(var(--s3) * var(--ratio));--s5: calc(var(--s4) * var(--ratio));--s6: calc(var(--s5) * var(--ratio))}[data-theme=light]{--text: var(--light-text);--bg: var(--light-bg);--input: var(--light-input);--element: var(--light-element);--header-shadow: var(--light-header-shadow);--nav-shadow: var(--light-nav-shadow);--bg-filter: var(--light-filter-icon);--bg-search: var(--light-search-icon)}[data-theme=dark]{--text: var(--dark-text);--bg: var(--dark-bg);--input: var(--dark-input);--element: var(--dark-element);--header-shadow: var(--dark-header-shadow);--nav-shadow: (--dark-nav-shadow);--bg-filter: var(--dark-filter-icon);--bg-search: var(--dark-search-icon)}.App{background-color:var(--bg);height:100%}.card__item{box-shadow:var(--header-shadow);background-color:var(--element);color:var(--text);border-radius:8px}.card__item img{width:100%;height:170px;object-fit:cover;object-position:center;border-radius:8px 8px 0 0}.card__item .details{padding:var(--s1);padding-block-start:var(--s0)}.card__item .details h3{margin-block:var(--s0);font-size:calc(1rem + .25vw);font-weight:800}.card__item .details h6{margin:0;font-size:calc(.9rem + .1vw);font-weight:600}.card__item .details h6>span{font-weight:400}.region__filter{color:var(--text);background-color:var(--element);box-shadow:var(--nav-shadow);padding:var(--s-1) var(--s3) var(--s-1) var(--s0);font-size:calc(.9rem + .01vw);border-radius:3px;background-image:var(--bg-filter);background-repeat:no-repeat;background-size:calc(.6rem + .25vw);background-position:90% 50%;border:none;-moz-appearance:none;-webkit-appearance:none;-ms-apperance:none;appearance:none}.region__filter *{padding:var(--s3) var(--s0);border:none}.loader{display:flex;justify-content:center;align-items:center;width:100vw}input[type=search]{position:relative;color:var(--text);padding:var(--s-1) var(--s0) var(--s-1) var(--s3);width:calc(19em + 2.5vw);border:none;border-radius:3px;box-shadow:var(--nav-shadow);font-size:calc(.9rem + .01vw);background-color:var(--element);background-image:var(--bg-search);background-repeat:no-repeat;background-size:calc(1rem + .25vw);background-position:8% 50%}main{height:100%;background-color:var(--bg)}.card__list{min-height:100vh;padding:0 calc(var(--s0) + 3vw);display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:var(--s3);padding-block:var(--s0) var(--s1);background-color:var(--bg)}.card__list a{text-decoration:none}header{display:flex;justify-content:space-between;align-items:center;padding:calc(var(--s0) + 1vw) calc(var(--s0) + 3vw);background-color:var(--element);color:var(--text);box-shadow:var(--header-shadow)}header a{text-decoration:none;color:inherit}header h2{font-size:calc(.8rem + 1vw);font-weight:800}header>button{display:flex;align-items:center;justify-content:space-around;border:none;font-size:calc(.7rem + .5vw);gap:var(--s-1);font-weight:600;background-color:inherit;color:currentColor}nav{width:100%;padding:calc(var(--s-1) + 2vw) calc(var(--s0) + 3vw);display:flex;justify-content:space-between;align-items:center;gap:var(--s1);flex-wrap:wrap}.country__details{display:flex;flex-direction:column;z-index:0;min-height:100vh;background-color:var(--bg);color:var(--text);padding:calc(var(--s1) + 1vw) calc(var(--s0) + 3vw)}.country__details button{color:var(--text);background-color:var(--element);box-shadow:var(--header-shadow);border:none}.country__details h4{font-size:calc(.7rem + .25vw);font-weight:600;line-height:var(--s2)}.country__details h1{font-size:calc(1.1rem + .5vw);font-weight:800;margin-block-end:1em}.country__details span{font-weight:400}.main__details{margin-block:auto;padding:calc(var(--s2) + 1vw) 0;display:flex;align-items:center;flex-wrap:wrap;gap:calc(4em + 6vw)}.main__details>*{flex:1 1 25rem}.country__flag img{width:100%}.back__btn button{display:flex;justify-content:space-evenly;align-items:center;padding:calc(var(--s-4) + .1vw) calc(var(--s-4) + 1.5vw);font-size:calc(.7rem + .25vw)}.back__btn span:last-child{margin-inline-start:1em}.country__info{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:calc(.8rem + 5vw)}.border__countries{margin-block-start:3rem;display:flex;align-items:center;flex-wrap:wrap;gap:.6rem}.border__countries span{display:inline-block;font-size:calc(.8rem + .25vw);font-weight:600;white-space:nowrap}.border__btn{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem}.border__countries button{padding:3px 25px;font-size:calc(.7rem + .25vw)}