/*Reset**********************************/
* {box-sizing:border-box}
html {font-size:100%; -webkit-text-size-adjust:100%; touch-action:manipulation}
html, body {margin:0; padding:0}
body {line-height:1}

body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display:block}

ol, ul {list-style:none}
blockquote, q {quotes:none}
blockquote:before, blockquote:after,
q:before, q:after {content:''; content:none}

table {border-collapse:collapse; border-spacing:0}

a {text-decoration:none}
a:active, a:hover {outline:0}

button,
input,
select,
textarea {margin:0; font:inherit; color:inherit; vertical-align:baseline}

button,
select {text-transform:none}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {-webkit-appearance:button; appearance:button; cursor:pointer}

button[disabled],
input[disabled] {cursor:default}

button::-moz-focus-inner,
input::-moz-focus-inner {border:0; padding:0}

input[type="checkbox"],
input[type="radio"] {box-sizing:border-box; padding:0}

input[type="search"] {-webkit-appearance:none; appearance:none; box-sizing:border-box}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {-webkit-appearance:none; appearance:none}

textarea {overflow:auto; vertical-align:top; resize:vertical}

img {max-width:100%; border:0; vertical-align:middle}

audio,
canvas,
video {display:inline-block; max-width:100%}

audio:not([controls]) {display:none; height:0}

fieldset {border:0; margin:0; padding:0}
legend {border:0; padding:0; white-space:normal}

[hidden] {display:none !important}

::selection {background:var(--BackgroundBlueTertiary); text-shadow:none}


/*System**********************************/
:root {
  --BaseFont:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Droid Sans","Helvetica Neue",sans-serif;
  --Small:0.9375rem;
  --SmallLine:1.1875rem;
  --Base:1.0625rem;
  --BaseLine:1.4375rem;
  --Large:1.1875rem;
  --LargeLine:1.5625rem;
  --Headline:1.4375rem;
  --HeadlineLine:1.8125rem;
  --Subtitle:1.5625rem;
  --SubtitleLine:1.9375rem;
  --Title:1.6875rem;
  --TitleLine:2.0625rem;
  --HeroTitle:var(--Subtitle);
  --HeroTitleLine:var(--SubtitleLine);
  --Regular:400;
  --Medium:500;
  --SemiBold:600;
  --Bold:700;

  --Sheet:34rem;
  --InsetBlock:1rem;
  --OffsetInBlock:1rem;
  --WidthBlock:53.75rem;
  --WidthWideBlock:72rem;
  --WidthNarrowBlock:30rem;

  --GapXXS:0.125rem;
  --GapXS:0.25rem;
  --GapS:0.5rem;
  --GapM:0.75rem;
  --GapL:1rem;
  --GapXL:1.5rem;
  --GapXXL:2rem;

  --InsetXXS:0.125rem;
  --InsetXS:0.25rem;
  --InsetS:0.5rem;
  --InsetM:0.75rem;
  --InsetL:1rem;
  --InsetXL:1.5rem;
  --InsetXXL:3rem;

  --OffsetXS:0.25rem;
  --OffsetS:0.5rem;
  --OffsetM:0.75rem;
  --OffsetL:1rem;
  --OffsetXL:1.5rem;
  --OffsetXXL:2rem;
  --OffsetAuto:auto;

  --ControlXXS:1.5rem;
  --ControlXS:2rem;
  --ControlS:2.25rem;
  --ControlM:2.75rem;
  --ControlL:3.25rem;
  --ControlXL:4rem;

  --IconXXS:1rem;
  --IconXS:1.125rem;
  --IconS:1.25rem;
  --IconM:1.5rem;
  --IconL:2.25rem;
  --IconXL:2.5rem;

  --Stroke:0.0625rem;
  --StrokeM:0.125rem;
  --StrokeL:0.25rem;
  --StrokeMax:0.5rem;

  --RadiusXXS:0.375rem;
  --RadiusXS:0.5rem;
  --RadiusS:0.625rem;
  --RadiusM:0.75rem;
  --RadiusL:1rem;
  --RadiusXL:1.25rem;
  --RadiusXXL:1.5rem;
  --RadiusMax:9999rem;

  --TextPrimary:rgba(34,32,31,1);
  --TextSecondary:rgba(104,102,101,1);
  --TextTertiary:rgba(150,148,148,1);
  --TextOnBackground:rgba(255,255,255,1);
  --TextLink:rgba(255,59,47,1);
  --TextLinkHover:rgba(199,11,0,1);
  --TextOrangeSecondary:rgba(153,89,0,1);
  --TextYellowSecondary:rgba(153,122,0,1);
  --TextGreen:rgba(53,199,89,1);
  --TextGreenSecondary:rgba(31,117,52,1);
  --TextGreenDeepSecondary:rgba(2,100,95,1);
  --TextTealSecondary:rgba(28,102,115,1);
  --TextLightBlueSecondary:rgba(19,115,159,1);
  --TextBlueSecondary:rgba(41,40,159,1);
  --TextPurpleSecondary:rgba(41,40,159,1);
  --TextPinkSecondary:rgba(125,33,171,1);
  --TextRed:rgba(255,44,85,1);
  --TextRedHover:rgba(219,0,43,1);
  --TextRedSecondary:rgba(199,0,39,1);

  --BackgroundCanvas:rgba(242,241,240,1);
  --BackgroundSurface:rgba(255,255,255,1);
  --BackgroundOnDark:rgba(255,255,255,1);
  --BackgroundPrimary:rgba(243,241,241,1);
  --BackgroundSecondary:rgba(228,226,226,1);
  --BackgroundTertiary:rgba(208,206,205,1);
  --BackgroundWhite:rgba(255,255,255,1);
  --BackgroundDark:rgba(34,32,31,1);
  --BackgroundOrangeDeep:rgba(255,59,47,1);
  --BackgroundOrangeDeepHover:rgba(199,11,0,1);
  --BackgroundOrange:rgba(255,149,0,1);
  --BackgroundYellow:rgba(255,204,2,1);
  --BackgroundYellowHover:rgba(229,183,0,1);
  --BackgroundGreen:rgba(53,199,89,1);
  --BackgroundGreenHover:rgba(42,157,70,1);
  --BackgroundGreenDeep:rgba(4,199,190,1);
  --BackgroundTeal:rgba(48,176,199,1);
  --BackgroundLightBlue:rgba(49,173,230,1);
  --BackgroundBlue:rgba(0,122,255,1);
  --BackgroundPurple:rgba(88,86,213,1);
  --BackgroundPink:rgba(175,82,222,1);
  --BackgroundRed:rgba(255,44,85,1);
  --BackgroundRedHover:rgba(219,0,43,1);
  --BackgroundBrown:rgba(162,132,94,1);
  --BackgroundOrangeDeepSecondary:rgba(250,212,210,1);
  --BackgroundOrangeSecondary:rgba(249,229,200,1);
  --BackgroundYellowSecondary:rgba(249,239,200,1);
  --BackgroundGreenSecondary:rgba(210,239,217,1);
  --BackgroundGreenDeepSecondary:rgba(218,243,243,1);
  --BackgroundTealSecondary:rgba(211,232,236,1);
  --BackgroundLightBlueSecondary:rgba(200,223,249,1);
  --BackgroundBlueSecondary:rgba(200,223,249,1);
  --BackgroundPurpleSecondary:rgba(220,219,240,1);
  --BackgroundPinkSecondary:rgba(234,218,242,1);
  --BackgroundRedSecondary:rgba(250,212,210,1);
  --BackgroundOrangeDeepTertiary:rgba(255,224,222,1);
  --BackgroundOrangeTertiary:rgba(255,238,214,1);
  --BackgroundYellowTertiary:rgba(255,247,215,1);
  --BackgroundGreenTertiary:rgba(223,246,228,1);
  --BackgroundGreenDeepTertiary:rgba(215,246,245,1);
  --BackgroundTealTertiary:rgba(222,242,246,1);
  --BackgroundLightBlueTertiary:rgba(222,242,251,1);
  --BackgroundBlueTertiary:rgba(214,234,255,1);
  --BackgroundPurpleTertiary:rgba(228,228,248,1);
  --BackgroundPinkTertiary:rgba(234,218,242,1);
  --BackgroundRedTertiary:rgba(255,224,222,1);
  --BackgroundOverlay:rgba(0,0,0,0.32);

  --IconPrimary:rgba(34,32,31,1);
  --IconSecondary:rgba(104,102,101,1);
  --IconTertiary:rgba(150,148,148,1);
  --IconOnBackground:rgba(255,255,255,1);
  --IconOrangeDeep:rgba(255,59,47,1);
  --IconOrange:rgba(255,149,0,1);
  --IconYellow:rgba(255,204,2,1);
  --IconGreen:rgba(53,199,89,1);
  --IconGreenSecondary:rgba(31,117,52,1);
  --IconGreenDeep:rgba(4,199,190,1);
  --IconTeal:rgba(48,176,199,1);
  --IconLightBlue:rgba(49,173,230,1);
  --IconBlue:rgba(0,122,255,1);
  --IconPurple:rgba(88,86,213,1);
  --IconPink:rgba(175,82,222,1);
  --IconRed:rgba(255,44,85,1);
  --IconBrown:rgba(162,132,94,1);

  --StrokePrimary:rgba(243,241,241,1);
  --StrokeSecondary:rgba(220,218,218,1);
  --StrokeOnDark:rgba(255,255,255,1);
  --StrokeAccent:rgba(255,59,47,1);
  --StrokeRed:rgba(255,44,85,1);

  --ShadowDefault:0 0.5rem 1.5rem 0 rgba(0,0,0,0.12);
  --ShadowHover:0 0.5rem 1.5rem 0 rgba(0,0,0,0.16);

  --SheetDur:.22s;
  --SheetEase:cubic-bezier(.2,.9,.2,1)
}

/*Base**********************************/
body {font-family:var(--BaseFont); font-size:var(--Base); line-height:var(--BaseLine); font-weight:var(--Regular); color:var(--TextPrimary)}
h1 {font-size:var(--Title); line-height:var(--TitleLine); font-weight:var(--SemiBold); letter-spacing:-0.03em}
h2 {font-size:var(--Subtitle); line-height:var(--SubtitleLine); font-weight:var(--SemiBold); letter-spacing:-0.02em}
h3 {font-size:var(--Headline); line-height:var(--HeadlineLine); font-weight:var(--SemiBold); letter-spacing:-0.02em}
h4 {font-size:var(--Large); line-height:var(--LargeLine); font-weight:var(--Medium)}
p {font-size:var(--Base); line-height:var(--BaseLine); font-weight:var(--Regular)}
.hero-title {font-size:var(--HeroTitle); line-height:var(--HeroTitleLine); font-weight:var(--SemiBold); letter-spacing:-0.03em}
.title {font-size:var(--Title); line-height:var(--TitleLine)}
.subtitle {font-size:var(--Subtitle); line-height:var(--SubtitleLine)}
.headline {font-size:var(--Headline); line-height:var(--HeadlineLine)}
.large {font-size:var(--Large); line-height:var(--LargeLine)}
.base {font-size:var(--Base); line-height:var(--BaseLine)}
.small, .disclaimer {font-size:var(--Small); line-height:var(--SmallLine)}
.regular {font-weight:var(--Regular)}
.medium {font-weight:var(--Medium)}
.semibold {font-weight:var(--SemiBold)}
.bold {font-weight:var(--Bold)}
.disclaimer {text-align:center; color:var(--TextTertiary)}

.text-with-icon {display:inline-flex; align-items:center; gap:var(--GapS)}
.text-with-icon svg {display:block; flex:0 0 auto; width:var(--IconXS); height:var(--IconXS)}
svg.done-green * {fill:var(--IconGreen); stroke:none}
svg.done-gray * {fill:var(--IconRed); stroke:none}

.desc-text {white-space:pre-line}
.desc-text--managed {white-space:normal}

/*Colors*/
.dark {color:var(--TextPrimary)}
.gray {color:var(--TextSecondary)}
.lightgray {color:var(--TextTertiary)}
.red {color:var(--TextRed)}
.accent {color:var(--TextLink)}
.icon-red svg * {fill:var(--BackgroundRed)}
.icon-green svg * {fill:var(--BackgroundGreen)}

/*Links*/
.link {display:inline-flex; align-items:center; padding:0; color:var(--TextLink); background:none; border:0; text-decoration:none; cursor:pointer; -webkit-appearance:none; appearance:none}
.link:hover {color:var(--TextLinkHover)}

.link--muted {color:var(--TextPrimary)}
.link--muted:hover {color:var(--TextLink)}

.link-text {display:block; line-height:1}
.link-icon {display:flex; flex:0 0 auto; align-items:center; justify-content:center; line-height:0}
.link-icon svg {display:block; width:100%; height:100%}
.link-icon svg * {fill:currentColor; stroke:none}

.link--icon-xs,
.link--icon-s {gap:var(--GapS)}
.link--icon-m {gap:var(--GapM)}

.link--icon-xs .link-icon,
.link--icon-s .link-icon {width:var(--IconXXS); height:var(--IconXXS)}
.link--icon-m .link-icon {width:var(--IconS); height:var(--IconS)}

/*Layout*/
main {position:relative}
section {display:flex; flex-direction:column}

.container {width:100%; max-width:var(--WidthBlock); margin:0 var(--OffsetAuto); padding:var(--InsetBlock); box-sizing:border-box}
.container--full {max-width:none}
.container--wide {max-width:var(--WidthWideBlock)}
.container--narrow {max-width:var(--WidthNarrowBlock)}

.container--column {display:flex; flex-direction:column; gap:var(--GapL)}
.container--row {display:flex; flex-flow:row wrap}

.container-headline {display:flex; flex-flow:row nowrap; align-items:baseline; justify-content:space-between; gap:var(--GapM)}
.container-headline--actions {align-items:center}
.container-headline--inline {justify-content:flex-start}
.container--row .container-headline {flex:0 0 100%; min-width:0}
.container--no-air .container-headline {margin:0 var(--OffsetInBlock)}

.container--no-air {padding:var(--InsetBlock) 0}
.container--no-air-top {padding-top:0}

.page-empty {min-height:100dvh; display:flex; flex-direction:column}
.empty-main {flex:1 1 auto; display:flex; flex-direction:column}
.page-empty .empty-main {align-items:center; justify-content:center}
.page-empty .empty-main > * {transform:translateY(-2rem)}

.canvas {background:var(--BackgroundCanvas)}
.surface {background:var(--BackgroundSurface)}

.overlap-top {position:relative; z-index:1; margin-top:-1.5rem; border-radius:var(--RadiusXXL) var(--RadiusXXL) 0 0}

.sticky-top {position:sticky; top:0; z-index:10; background:var(--BackgroundWhite)}
.sticky-bottom {position:sticky; bottom:0; z-index:10; padding-bottom:env(safe-area-inset-bottom); background:var(--BackgroundWhite)}
.sticky-bottom--divider {border-top:var(--Stroke) solid var(--StrokeSecondary)}

.safe-content {padding-bottom:env(safe-area-inset-bottom)}

.favorites-panel {pointer-events:none; padding:var(--InsetL) 0; align-items:center; justify-content:center; background:transparent}
.favorites-panel .btn {pointer-events:auto}

.layout-grid,
.layout-main,
.layout-aside {display:flex; flex-direction:column; gap:0}

main,
header,
.hero-section {border-radius:var(--RadiusXXL) var(--RadiusXXL) 0 0}

/*Cards List & Grid*/
.list--cards {gap:var(--GapL)}

.grid {display:flex; flex-flow:row wrap}
.grid--cards {row-gap:var(--GapL); column-gap:var(--GapS)}
.grid--cards-2 > .card {flex:0 0 calc(50% - (var(--GapS) / 2)); min-width:0}

/*Hero*/
.hero-section {padding-bottom:calc(var(--InsetXL) + var(--RadiusXXL))}

.hero-page {align-items:center; justify-content:center; gap:var(--GapS)}
.hero-page--main {gap:var(--GapXS)}
.hero-page h1, .hero-page h3, .hero-page p {text-align:center}
.hero-note {font-size:var(--Base); line-height:var(--BaseLine); color:var(--TextSecondary)}
.hero-hint {font-size:var(--Small); line-height:var(--SmallLine); color:var(--TextSecondary)}
.hero-img {}
.hero-img--icon {display:block; max-height:10rem; width:auto}
.hero-action {margin-top:var(--OffsetL); width:100%}

.hero-subpage {align-items:flex-start; justify-content:flex-start; gap:var(--GapS)}
.hero-subpage h1, .hero-subpage h3, .hero-subpage p {text-align:left;}

.hero-form {display:flex; flex-direction:column; gap:var(--GapL); padding:0 var(--InsetBlock)}
.hero-form-btn-map {margin:var(--OffsetM) auto 0 auto}

.hero-listing {display:flex; flex-direction:column; gap:var(--GapS)}
.hero-listing h1, .hero-listing h3, .hero-listing p {text-align:left}
.hero-listing .label-avalible {margin-bottom:var(--OffsetM)}

/*Header*/
header {display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:center; gap:var(--GapM); padding:var(--InsetS)}
.header-left, .header-center, .header-right {display:flex; flex-flow:row nowrap; align-items:center}
.header-left, .header-right {flex:0 0 auto; gap:var(--GapS)}
.header-center {flex:1 1 auto; justify-content:flex-start}
.header-center--logo {flex:0 0 auto; align-self:center}
.header-center--label {flex:0 0 auto; align-self:center}

.header--overlap {position:absolute; top:0; left:0; right:0; z-index:10; pointer-events:none}
.header--overlap :is(a, button) {pointer-events:auto}
.header--start {justify-content:flex-start}
.header--end {justify-content:flex-end}
.header--center {align-items:center; position:relative}

.header-btn-city {display:flex; flex-flow:row nowrap; align-items:center; gap:var(--GapM)}

.header-title--logo {display:inline-flex; flex-flow:row nowrap; justify-content:center; align-items:center; height:var(--ControlM); padding:0 var(--InsetM); color:var(--TextLink); border-radius:var(--RadiusL); text-decoration:none}
.header-title--logo svg {display:block; width:auto; height:1.75rem}
.header-title--logo svg * {fill:currentColor; stroke:none}
.header-title--logo--white {color:var(--TextOnBackground)}
a.header-title--logo {color:var(--TextLink)}
a.header-title--logo:hover {color:var(--TextLinkHover)}
a.header-title--logo.header-title--logo--white {color:var(--TextOnBackground)}
a.header-title--logo.header-title--logo--white:hover {color:var(--TextLink)}

/*Footer*/
footer {margin-top:var(--OffsetXL); border-top:var(--Stroke) solid var(--StrokeSecondary); padding-bottom:env(safe-area-inset-bottom)}
footer .container {display:flex; flex-direction:column; gap:var(--GapM)}
footer .copyright {color:var(--TextTertiary)}