.site {
    container-type: inline-size;
    container-name: viewport;
    --color-background: white;
    --color-neutral: black;
    --color-primary: black;
    --color-secondary: black;
    --color-tertiary: black;
    --color-red: #f04242;
    --transition-duration-short: 100ms;
    --transition-duration: 200ms;
    --transition-duration-long: 400ms;
    --easing: cubic-bezier(0.32, 0.72, 0, 1);
    --border-radius-small: 8px;
    --border-radius-medium: 12px;
    --border-radius-large: 16px;
    --border-radius-extra-large: 24px;
    --border-radius-button: 100px;
    --border-radius-input: var(--border-radius-medium);
    --input-height-extra-small: 32px;
    --input-height-small: 40px;
    --input-height: 48px;
    --input-height-large: 56px;
    --input-height-extra-large: 64px;
    --font-family-base: Figtree, sans-serif;
    --font-family-heading: Figtree, sans-serif;
    --font-family-mono: monospace;
    --font-size-offset: 0rem;
    --font-size-heading-offset: 0rem;
    --font-weight-base: 400;
    --font-weight-heading: 700;
    --font-weight-button: calc(var(--font-weight-base) + 100);
    --column-width: 64px;
    --gutter-width: 40px;
    --gutter-width-small: 24px;
    --page-padding: 24px;
    --section-padding-small: 40px;
    --section-padding-medium: 80px;
    --section-padding-large: 120px;
    --header-height-extra-small: 64px;
    --header-height-small: 96px;
    --header-height-medium: 128px;
    --header-height-large: 160px;
    --header-height-extra-large: 192px;
    --z-index-header: 9
}

@container viewport (max-width: 768px) {
    .site {
        --header-height-small: 80px;
        --header-height-medium: 96px;
        --header-height-large: 112px;
        --header-height-extra-large: 128px
    }
}

* {
    --color-neutral-80: rgb(from var(--color-neutral) r g b / calc(76% + var(--alpha-offset-neutral)));
    --color-neutral-60: rgb(from var(--color-neutral) r g b / calc(56% + var(--alpha-offset-neutral)));
    --color-neutral-40: rgb(from var(--color-neutral) r g b / calc(32% + var(--alpha-offset-neutral)));
    --color-neutral-30: rgb(from var(--color-neutral) r g b / calc(24% + var(--alpha-offset-neutral)));
    --color-neutral-20: rgb(from var(--color-neutral) r g b / calc(16% + var(--alpha-offset-neutral)));
    --color-neutral-10: rgb(from var(--color-neutral) r g b / calc(6% + var(--alpha-offset-neutral)));
    --color-neutral-5: rgb(from var(--color-neutral) r g b / calc(3% + var(--alpha-offset-neutral)));
    --color-primary-60: rgb(from var(--color-primary) r g b / 60%);
    --color-primary-40: rgb(from var(--color-primary) r g b / 40%);
    --color-primary-30: rgb(from var(--color-primary) r g b / 30%);
    --color-primary-20: rgb(from var(--color-primary) r g b / 20%);
    --color-primary-10: rgb(from var(--color-primary) r g b / 10%);
    --color-selection: var(--color-neutral-20);
    --shadow: 0 2px 8px -2px rgb(from var(--color-shadow) r g b / 7.5%), 0 0 0 1px var(--color-neutral-5);
    --font-size-extra-small: calc(0.875rem + var(--font-size-offset));
    --font-size-small: calc(1rem + var(--font-size-offset));
    --font-size-medium: calc(1.125rem + var(--font-size-offset));
    --font-size-large: calc(1.3125rem + var(--font-size-offset));
    --font-size-extra-large: calc(1.5rem + var(--font-size-offset));
    --font-size-extra-extra-large: calc(1.75rem + var(--font-size-offset));
    --font-size-heading-extra-small: calc(1.125rem + var(--font-size-heading-offset));
    --font-size-heading-small: calc(1.75rem + var(--font-size-heading-offset));
    --font-size-heading-medium: calc(2.625rem + var(--font-size-heading-offset));
    --font-size-heading-large: calc(4rem + var(--font-size-heading-offset));
    --font-size-heading-extra-large: calc(6rem + var(--font-size-heading-offset))
}

@container viewport (max-width: 768px) {
    * {
        --font-size-heading-extra-small: calc(1.125rem + var(--font-size-heading-offset));
        --font-size-heading-small: calc(1.5rem + var(--font-size-heading-offset));
        --font-size-heading-medium: calc(2.25rem + var(--font-size-heading-offset));
        --font-size-heading-large: calc(3rem + var(--font-size-heading-offset));
        --font-size-heading-extra-large: calc(4rem + var(--font-size-heading-offset))
    }
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

@keyframes scroll-1 {

    from,
    to {
        scroll-behavior: smooth
    }
}

@keyframes scroll-2 {

    from,
    to {
        scroll-behavior: smooth
    }
}

html {
    animation: scroll-1 1s
}

html:focus-within {
    animation-name: scroll-2;
    scroll-behavior: smooth
}

html,
body {
    min-height: 100dvh
}

body,
.body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-color: var(--color-background);
    color: var(--color-neutral);
    font-family: var(--font-family-base);
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-base);
    line-height: 1.5;
    text-rendering: optimizeLegibility
}

h1 {
    font-size: var(--font-size-heading-large)
}

h2 {
    font-size: var(--font-size-heading-medium)
}

img {
    display: block;
    height: auto;
    max-width: 100%;
    outline: none;
    width: 100%
}

a,
button {
    cursor: pointer
}

button {
    appearance: none;
    background: none;
    border: none;
    color: inherit;
    font: inherit
}

::selection {
    background: var(--color-selection)
}

.block {
    --default-margin: 24px;
    flex-shrink: 0;
    grid-column: 2/-2;
    margin-top: var(--default-margin);
    min-width: 0;
    overflow-wrap: anywhere;
    position: relative;
    width: 100%
}

.block:first-child {
    margin-top: 0 !important
}

.block+.block {
    margin-top: var(--default-margin)
}

.block.paragraph {
    --default-margin: calc(var(--size) - var(--font-size-offset))
}

.block.heading {
    --default-margin: calc(var(--size) - var(--font-size-heading-offset))
}

.block.heading+.heading {
    margin-top: calc((var(--size) - var(--font-size-heading-offset))*.25 + .5rem)
}

.block.heading+.paragraph {
    margin-top: calc((var(--size) - var(--font-size-offset))*.75)
}

.block.wrapper:has(.media),
.block.media,
.block.card,
.block.row {
    --default-margin: 40px
}

.block.wrapper:has(.media)+.block,
.block.media+.block,
.block.card+.block,
.block.row+.block {
    margin-top: max(40px, var(--default-margin))
}

.block.stack>.block {
    margin: 0 !important
}

.block.stack>.block.wrapper,
.block.stack>.block.stack,
.block.stack>.block.paragraph,
.block.stack>.block.heading {
    width: auto
}

*:not(.section):not(.header)>.block {
    max-width: 100%
}

.z-3 {
    z-index: 3
}

.button {
    --padding: 20px;
    --height: var(--input-height);
    align-items: center;
    appearance: none;
    background-color: var(--color-primary-surface);
    background-clip: padding-box;
    border-radius: var(--border-radius-button);
    border: none;
    box-shadow: inset 0 64px hsla(0, 0%, 100%, 0);
    color: var(--color-primary-foreground);
    cursor: pointer;
    display: flex;
    font-family: var(--font-family-base);
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-button);
    gap: 4px;
    height: var(--height);
    justify-content: center;
    max-width: 100%;
    padding: 0 var(--padding);
    text-align: center;
    text-decoration: none;
    transition-property: background-color, border-color, box-shadow, color, opacity, transform;
    transition-duration: var(--transition-duration);
    user-select: none;
    white-space: nowrap;
    width: fit-content
}

.button:not(:focus-visible) {
    outline: none
}

.button:hover {
    box-shadow: inset 0 64px hsla(0, 0%, 100%, .1)
}

.button:active {
    box-shadow: inset 0 64px rgba(0, 0, 0, .1)
}

.button.-tertiary {
    --color: var(--color-primary-safe);
    background-color: rgba(0, 0, 0, 0) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    color: var(--color);
    padding: 0;
    height: auto;
    padding: 2px 0
}

.button.-tertiary:hover {
    opacity: .85
}

.button.-tertiary:active {
    opacity: 1
}

.button.-small {
    --padding: 16px;
    --height: var(--input-height-small);
    font-size: var(--font-size-small)
}

.button.-large {
    --padding: 24px;
    --height: var(--input-height-large);
    font-size: var(--font-size-large)
}

.card {
    --radius: var(--border-radius-extra-large);
    align-items: flex-start;
    background-color: var(--color-background);
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    padding: 24px
}

.card.-justify-center {
    align-items: center
}

.card.-radius-none {
    --radius: 0
}

.card.-image .block {
    z-index: 2
}

.card>.link {
    position: absolute;
    inset: 0;
    z-index: 3
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-4px) translateX(-50%)
    }

    to {
        opacity: 1;
        transform: translateX(-50%)
    }
}

.row {
    display: flex;
    flex-direction: column;
    position: relative;
    row-gap: 24px
}

.row>* {
    margin: 0 !important
}

.row.-align-center {
    align-items: center
}

@container viewport (min-width: 1024px) {
    .row {
        align-items: start;
        display: grid;
        grid-template-columns: subgrid;
        row-gap: 24px
    }

    .row>* {
        grid-row-start: 1 !important
    }
}

.block:nth-child(1) {
    grid-row: 1
}

.block:nth-child(2) {
    grid-row: 2
}

.block:nth-child(3) {
    grid-row: 3
}

.block:nth-child(4) {
    grid-row: 4
}

.block:nth-child(5) {
    grid-row: 5
}

.block:nth-child(6) {
    grid-row: 6
}

.block:nth-child(7) {
    grid-row: 7
}

.block:nth-child(8) {
    grid-row: 8
}

.block:nth-child(9) {
    grid-row: 9
}

.block:nth-child(10) {
    grid-row: 10
}

.block:nth-child(11) {
    grid-row: 11
}

.block:nth-child(12) {
    grid-row: 12
}

.block:nth-child(13) {
    grid-row: 13
}

.block:nth-child(14) {
    grid-row: 14
}

.block:nth-child(15) {
    grid-row: 15
}

.block:nth-child(16) {
    grid-row: 16
}

.block:nth-child(17) {
    grid-row: 17
}

.block:nth-child(18) {
    grid-row: 18
}

.block:nth-child(19) {
    grid-row: 19
}

.block:nth-child(20) {
    grid-row: 20
}

.block:nth-child(21) {
    grid-row: 21
}

.block:nth-child(22) {
    grid-row: 22
}

.block:nth-child(23) {
    grid-row: 23
}

.block:nth-child(24) {
    grid-row: 24
}

.block:nth-child(25) {
    grid-row: 25
}

.block:nth-child(26) {
    grid-row: 26
}

.block:nth-child(27) {
    grid-row: 27
}

.block:nth-child(28) {
    grid-row: 28
}

.block:nth-child(29) {
    grid-row: 29
}

.block:nth-child(30) {
    grid-row: 30
}

.block:nth-child(31) {
    grid-row: 31
}

.block:nth-child(32) {
    grid-row: 32
}

.block:nth-child(33) {
    grid-row: 33
}

.block:nth-child(34) {
    grid-row: 34
}

.block:nth-child(35) {
    grid-row: 35
}

.block:nth-child(36) {
    grid-row: 36
}

.block:nth-child(37) {
    grid-row: 37
}

.block:nth-child(38) {
    grid-row: 38
}

.block:nth-child(39) {
    grid-row: 39
}

.block:nth-child(40) {
    grid-row: 40
}

.block:nth-child(41) {
    grid-row: 41
}

.block:nth-child(42) {
    grid-row: 42
}

.block:nth-child(43) {
    grid-row: 43
}

.block:nth-child(44) {
    grid-row: 44
}

.block:nth-child(45) {
    grid-row: 45
}

.block:nth-child(46) {
    grid-row: 46
}

.block:nth-child(47) {
    grid-row: 47
}

.block:nth-child(48) {
    grid-row: 48
}

.block:nth-child(49) {
    grid-row: 49
}

.block:nth-child(50) {
    grid-row: 50
}

.block:nth-child(51) {
    grid-row: 51
}

.block:nth-child(52) {
    grid-row: 52
}

.block:nth-child(53) {
    grid-row: 53
}

.block:nth-child(54) {
    grid-row: 54
}

.block:nth-child(55) {
    grid-row: 55
}

.block:nth-child(56) {
    grid-row: 56
}

.block:nth-child(57) {
    grid-row: 57
}

.block:nth-child(58) {
    grid-row: 58
}

.block:nth-child(59) {
    grid-row: 59
}

.block:nth-child(60) {
    grid-row: 60
}

.block:nth-child(61) {
    grid-row: 61
}

.block:nth-child(62) {
    grid-row: 62
}

.block:nth-child(63) {
    grid-row: 63
}

.block:nth-child(64) {
    grid-row: 64
}

.block:nth-child(65) {
    grid-row: 65
}

.block:nth-child(66) {
    grid-row: 66
}

.block:nth-child(67) {
    grid-row: 67
}

.block:nth-child(68) {
    grid-row: 68
}

.block:nth-child(69) {
    grid-row: 69
}

.block:nth-child(70) {
    grid-row: 70
}

.block:nth-child(71) {
    grid-row: 71
}

.block:nth-child(72) {
    grid-row: 72
}

.block:nth-child(73) {
    grid-row: 73
}

.block:nth-child(74) {
    grid-row: 74
}

.block:nth-child(75) {
    grid-row: 75
}

.block:nth-child(76) {
    grid-row: 76
}

.block:nth-child(77) {
    grid-row: 77
}

.block:nth-child(78) {
    grid-row: 78
}

.block:nth-child(79) {
    grid-row: 79
}

.block:nth-child(80) {
    grid-row: 80
}

.block:nth-child(81) {
    grid-row: 81
}

.block:nth-child(82) {
    grid-row: 82
}

.block:nth-child(83) {
    grid-row: 83
}

.block:nth-child(84) {
    grid-row: 84
}

.block:nth-child(85) {
    grid-row: 85
}

.block:nth-child(86) {
    grid-row: 86
}

.block:nth-child(87) {
    grid-row: 87
}

.block:nth-child(88) {
    grid-row: 88
}

.block:nth-child(89) {
    grid-row: 89
}

.block:nth-child(90) {
    grid-row: 90
}

.block:nth-child(91) {
    grid-row: 91
}

.block:nth-child(92) {
    grid-row: 92
}

.block:nth-child(93) {
    grid-row: 93
}

.block:nth-child(94) {
    grid-row: 94
}

.block:nth-child(95) {
    grid-row: 95
}

.block:nth-child(96) {
    grid-row: 96
}

.block:nth-child(97) {
    grid-row: 97
}

.block:nth-child(98) {
    grid-row: 98
}

.block:nth-child(99) {
    grid-row: 99
}

.block:nth-child(100) {
    grid-row: 100
}

.block:nth-child(101) {
    grid-row: 101
}

.block:nth-child(102) {
    grid-row: 102
}

.block:nth-child(103) {
    grid-row: 103
}

.block:nth-child(104) {
    grid-row: 104
}

.block:nth-child(105) {
    grid-row: 105
}

.block:nth-child(106) {
    grid-row: 106
}

.block:nth-child(107) {
    grid-row: 107
}

.block:nth-child(108) {
    grid-row: 108
}

.block:nth-child(109) {
    grid-row: 109
}

.block:nth-child(110) {
    grid-row: 110
}

.block:nth-child(111) {
    grid-row: 111
}

.block:nth-child(112) {
    grid-row: 112
}

.block:nth-child(113) {
    grid-row: 113
}

.block:nth-child(114) {
    grid-row: 114
}

.block:nth-child(115) {
    grid-row: 115
}

.block:nth-child(116) {
    grid-row: 116
}

.block:nth-child(117) {
    grid-row: 117
}

.block:nth-child(118) {
    grid-row: 118
}

.block:nth-child(119) {
    grid-row: 119
}

.block:nth-child(120) {
    grid-row: 120
}

.block:nth-child(121) {
    grid-row: 121
}

.block:nth-child(122) {
    grid-row: 122
}

.block:nth-child(123) {
    grid-row: 123
}

.block:nth-child(124) {
    grid-row: 124
}

.block:nth-child(125) {
    grid-row: 125
}

.block:nth-child(126) {
    grid-row: 126
}

.block:nth-child(127) {
    grid-row: 127
}

.block:nth-child(128) {
    grid-row: 128
}

.block:nth-child(129) {
    grid-row: 129
}

.block:nth-child(130) {
    grid-row: 130
}

.block:nth-child(131) {
    grid-row: 131
}

.block:nth-child(132) {
    grid-row: 132
}

.block:nth-child(133) {
    grid-row: 133
}

.block:nth-child(134) {
    grid-row: 134
}

.block:nth-child(135) {
    grid-row: 135
}

.block:nth-child(136) {
    grid-row: 136
}

.block:nth-child(137) {
    grid-row: 137
}

.block:nth-child(138) {
    grid-row: 138
}

.block:nth-child(139) {
    grid-row: 139
}

.block:nth-child(140) {
    grid-row: 140
}

.block:nth-child(141) {
    grid-row: 141
}

.block:nth-child(142) {
    grid-row: 142
}

.block:nth-child(143) {
    grid-row: 143
}

.block:nth-child(144) {
    grid-row: 144
}

.block:nth-child(145) {
    grid-row: 145
}

.block:nth-child(146) {
    grid-row: 146
}

.block:nth-child(147) {
    grid-row: 147
}

.block:nth-child(148) {
    grid-row: 148
}

.block:nth-child(149) {
    grid-row: 149
}

.block:nth-child(150) {
    grid-row: 150
}

.block:nth-child(151) {
    grid-row: 151
}

.block:nth-child(152) {
    grid-row: 152
}

.block:nth-child(153) {
    grid-row: 153
}

.block:nth-child(154) {
    grid-row: 154
}

.block:nth-child(155) {
    grid-row: 155
}

.block:nth-child(156) {
    grid-row: 156
}

.block:nth-child(157) {
    grid-row: 157
}

.block:nth-child(158) {
    grid-row: 158
}

.block:nth-child(159) {
    grid-row: 159
}

.block:nth-child(160) {
    grid-row: 160
}

.block:nth-child(161) {
    grid-row: 161
}

.block:nth-child(162) {
    grid-row: 162
}

.block:nth-child(163) {
    grid-row: 163
}

.block:nth-child(164) {
    grid-row: 164
}

.block:nth-child(165) {
    grid-row: 165
}

.block:nth-child(166) {
    grid-row: 166
}

.block:nth-child(167) {
    grid-row: 167
}

.block:nth-child(168) {
    grid-row: 168
}

.block:nth-child(169) {
    grid-row: 169
}

.block:nth-child(170) {
    grid-row: 170
}

.block:nth-child(171) {
    grid-row: 171
}

.block:nth-child(172) {
    grid-row: 172
}

.block:nth-child(173) {
    grid-row: 173
}

.block:nth-child(174) {
    grid-row: 174
}

.block:nth-child(175) {
    grid-row: 175
}

.block:nth-child(176) {
    grid-row: 176
}

.block:nth-child(177) {
    grid-row: 177
}

.block:nth-child(178) {
    grid-row: 178
}

.block:nth-child(179) {
    grid-row: 179
}

.block:nth-child(180) {
    grid-row: 180
}

.block:nth-child(181) {
    grid-row: 181
}

.block:nth-child(182) {
    grid-row: 182
}

.block:nth-child(183) {
    grid-row: 183
}

.block:nth-child(184) {
    grid-row: 184
}

.block:nth-child(185) {
    grid-row: 185
}

.block:nth-child(186) {
    grid-row: 186
}

.block:nth-child(187) {
    grid-row: 187
}

.block:nth-child(188) {
    grid-row: 188
}

.block:nth-child(189) {
    grid-row: 189
}

.block:nth-child(190) {
    grid-row: 190
}

.block:nth-child(191) {
    grid-row: 191
}

.block:nth-child(192) {
    grid-row: 192
}

.block:nth-child(193) {
    grid-row: 193
}

.block:nth-child(194) {
    grid-row: 194
}

.block:nth-child(195) {
    grid-row: 195
}

.block:nth-child(196) {
    grid-row: 196
}

.block:nth-child(197) {
    grid-row: 197
}

.block:nth-child(198) {
    grid-row: 198
}

.block:nth-child(199) {
    grid-row: 199
}

.block:nth-child(200) {
    grid-row: 200
}

.block:nth-child(201) {
    grid-row: 201
}

.block:nth-child(202) {
    grid-row: 202
}

.block:nth-child(203) {
    grid-row: 203
}

.block:nth-child(204) {
    grid-row: 204
}

.block:nth-child(205) {
    grid-row: 205
}

.block:nth-child(206) {
    grid-row: 206
}

.block:nth-child(207) {
    grid-row: 207
}

.block:nth-child(208) {
    grid-row: 208
}

.block:nth-child(209) {
    grid-row: 209
}

.block:nth-child(210) {
    grid-row: 210
}

.block:nth-child(211) {
    grid-row: 211
}

.block:nth-child(212) {
    grid-row: 212
}

.block:nth-child(213) {
    grid-row: 213
}

.block:nth-child(214) {
    grid-row: 214
}

.block:nth-child(215) {
    grid-row: 215
}

.block:nth-child(216) {
    grid-row: 216
}

.block:nth-child(217) {
    grid-row: 217
}

.block:nth-child(218) {
    grid-row: 218
}

.block:nth-child(219) {
    grid-row: 219
}

.block:nth-child(220) {
    grid-row: 220
}

.block:nth-child(221) {
    grid-row: 221
}

.block:nth-child(222) {
    grid-row: 222
}

.block:nth-child(223) {
    grid-row: 223
}

.block:nth-child(224) {
    grid-row: 224
}

.block:nth-child(225) {
    grid-row: 225
}

.block:nth-child(226) {
    grid-row: 226
}

.block:nth-child(227) {
    grid-row: 227
}

.block:nth-child(228) {
    grid-row: 228
}

.block:nth-child(229) {
    grid-row: 229
}

.block:nth-child(230) {
    grid-row: 230
}

.block:nth-child(231) {
    grid-row: 231
}

.block:nth-child(232) {
    grid-row: 232
}

.block:nth-child(233) {
    grid-row: 233
}

.block:nth-child(234) {
    grid-row: 234
}

.block:nth-child(235) {
    grid-row: 235
}

.block:nth-child(236) {
    grid-row: 236
}

.block:nth-child(237) {
    grid-row: 237
}

.block:nth-child(238) {
    grid-row: 238
}

.block:nth-child(239) {
    grid-row: 239
}

.block:nth-child(240) {
    grid-row: 240
}

.block:nth-child(241) {
    grid-row: 241
}

.block:nth-child(242) {
    grid-row: 242
}

.block:nth-child(243) {
    grid-row: 243
}

.block:nth-child(244) {
    grid-row: 244
}

.block:nth-child(245) {
    grid-row: 245
}

.block:nth-child(246) {
    grid-row: 246
}

.block:nth-child(247) {
    grid-row: 247
}

.block:nth-child(248) {
    grid-row: 248
}

.block:nth-child(249) {
    grid-row: 249
}

.block:nth-child(250) {
    grid-row: 250
}

@container viewport (max-width: 1023px) {
    .row {
        display: flex;
        flex-direction: column
    }

    .block.-start-1 {
        grid-column-start: 2
    }

    .block.-start-3 {
        grid-column-start: 2
    }

    .block.-start-4 {
        grid-column-start: 2
    }

    .block.-end-4 {
        grid-column-end: 3
    }

    .block.-start-5 {
        grid-column-start: 2
    }

    .block.-end-5 {
        grid-column-end: 3
    }

    .block.-end-8 {
        grid-column-end: 3
    }

    .block.-start-9 {
        grid-column-start: 2
    }

    .block.-end-9 {
        grid-column-end: 3
    }

    .block.-end-10 {
        grid-column-end: 3
    }

    .block.-end-12 {
        grid-column-end: 3
    }

    .block:not(.-start-left)>.block {
        grid-column-start: 1
    }

    .block:not(.-start-left)>.block:not(.-end-right) {
        grid-column-end: 2
    }
}

@container viewport (min-width: 1024px) {

    .block.-start-1 {
        grid-column-start: 2
    }

    .block.-start-1>.block.-start-1 {
        grid-column-start: 1
    }

    .block.-start-1>.block.-start-3 {
        grid-column-start: 3
    }

    .block.-start-1>.block.-start-4 {
        grid-column-start: 4
    }

    .block.-start-1>.block.-end-4 {
        grid-column-end: 5
    }

    .block.-start-1>.block.-start-5 {
        grid-column-start: 5
    }

    .block.-start-1>.block.-end-5 {
        grid-column-end: 6
    }

    .block.-start-1>.block.-end-8 {
        grid-column-end: 9
    }

    .block.-start-1>.block.-start-9 {
        grid-column-start: 9
    }

    .block.-start-1>.block.-end-9 {
        grid-column-end: 10
    }

    .block.-start-1>.block.-end-10 {
        grid-column-end: 11
    }

    .block.-start-1>.block.-end-12 {
        grid-column-end: 13
    }

    .block.-start-3 {
        grid-column-start: 4
    }

    .block.-start-3>.block.-start-3 {
        grid-column-start: 1
    }

    .block.-start-3>.block.-start-4 {
        grid-column-start: 2
    }

    .block.-start-3>.block.-end-4 {
        grid-column-end: 3
    }

    .block.-start-3>.block.-start-5 {
        grid-column-start: 3
    }

    .block.-start-3>.block.-end-5 {
        grid-column-end: 4
    }

    .block.-start-3>.block.-end-8 {
        grid-column-end: 7
    }

    .block.-start-3>.block.-start-9 {
        grid-column-start: 7
    }

    .block.-start-3>.block.-end-9 {
        grid-column-end: 8
    }

    .block.-start-3>.block.-end-10 {
        grid-column-end: 9
    }

    .block.-start-3>.block.-end-12 {
        grid-column-end: 11
    }

    .block.-start-4 {
        grid-column-start: 5
    }

    .block.-end-4 {
        grid-column-end: 6
    }

    .block.-start-4>.block.-start-4 {
        grid-column-start: 1
    }

    .block.-start-4>.block.-end-4 {
        grid-column-end: 2
    }

    .block.-start-4>.block.-start-5 {
        grid-column-start: 2
    }

    .block.-start-4>.block.-end-5 {
        grid-column-end: 3
    }

    .block.-start-4>.block.-end-8 {
        grid-column-end: 6
    }

    .block.-start-4>.block.-start-9 {
        grid-column-start: 6
    }

    .block.-start-4>.block.-end-9 {
        grid-column-end: 7
    }

    .block.-start-4>.block.-end-10 {
        grid-column-end: 8
    }

    .block.-start-4>.block.-end-12 {
        grid-column-end: 10
    }

    .block.-start-5 {
        grid-column-start: 6
    }

    .block.-end-5 {
        grid-column-end: 7
    }

    .block.-start-5>.block.-start-5 {
        grid-column-start: 1
    }

    .block.-start-5>.block.-end-5 {
        grid-column-end: 2
    }

    .block.-start-5>.block.-end-8 {
        grid-column-end: 5
    }

    .block.-start-5>.block.-start-9 {
        grid-column-start: 5
    }

    .block.-start-5>.block.-end-9 {
        grid-column-end: 6
    }

    .block.-start-5>.block.-end-10 {
        grid-column-end: 7
    }

    .block.-start-5>.block.-end-12 {
        grid-column-end: 9
    }

    .block.-end-8 {
        grid-column-end: 10
    }

    .block.-start-9 {
        grid-column-start: 10
    }

    .block.-end-9 {
        grid-column-end: 11
    }

    .block.-start-9>.block.-start-9 {
        grid-column-start: 1
    }

    .block.-start-9>.block.-end-9 {
        grid-column-end: 2
    }

    .block.-start-9>.block.-end-10 {
        grid-column-end: 3
    }

    .block.-start-9>.block.-end-12 {
        grid-column-end: 5
    }

    .block.-end-10 {
        grid-column-end: 12
    }

    .block.-end-12 {
        grid-column-end: 14
    }
}

.container {
    align-content: start;
    display: grid;
    grid-template-columns: subgrid;
    position: relative
}

.container.-align-center {
    align-content: center
}

.heading {
    color: var(--color-neutral);
    font-family: var(--font-family-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--size);
    flex-shrink: 1;
    line-height: calc(var(--size) - var(--font-size-heading-offset) + var(--line-height-modifier));
    letter-spacing: var(--letter-spacing)
}

.heading.-small {
    --letter-spacing: -0.02em;
    --line-height-modifier: 0.5rem;
    --size: var(--font-size-heading-small);
    text-wrap: pretty
}

.heading.-medium {
    --letter-spacing: -0.02em;
    --line-height-modifier: 0.5rem;
    --size: var(--font-size-heading-medium);
    text-wrap: balance
}

.heading.-large {
    --letter-spacing: -0.03em;
    --line-height-modifier: 0.25rem;
    --size: var(--font-size-heading-large);
    text-wrap: balance
}

.link {
    color: currentColor;
    transition-duration: var(--transition-duration-short);
    transition-property: text-decoration, color;
    text-decoration: underline;
    text-decoration-color: var(--color-neutral-20);
    position: relative
}

.link:hover {
    text-decoration-color: var(--color-neutral-40)
}

.link.-small {
    font-size: var(--font-size-small)
}

.link.-large {
    font-size: var(--font-size-large)
}

.list {
    padding-left: 24px
}

.list_item {
    color: var(--color-neutral);
    position: relative
}

.list_item+.list_item,
.list_item .list {
    margin-top: .5em
}

.list_item:has(>.paragraph.-extra-small)::marker {
    font-size: var(--font-size-extra-small)
}

.list_item:has(>.paragraph.-small)::marker {
    font-size: var(--font-size-small)
}

.list_item:has(>.paragraph.-large)::marker {
    font-size: var(--font-size-large)
}

.list_item:has(>.paragraph.-extra-large)::marker {
    font-size: var(--font-size-extra-large)
}

ul.list {
    list-style-type: disc
}

ul.list>li>ul {
    list-style-type: circle
}

ul.list>li>ul>li>ul {
    list-style-type: square
}

ul.list>li>ul>li>ul>li>ul {
    list-style-type: disc
}

ul.list>li>ul>li>ul>li>ul>li>ul {
    list-style-type: circle
}

ul.list>li>ul>li>ul>li>ul>li>ul>li>ul {
    list-style-type: square
}

ul.list>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul {
    list-style-type: disc
}

.media {
    --radius: 0;
    border-radius: var(--radius);
    max-width: 100%;
    position: relative;
    width: 100%
}

.media>.link {
    inset: 0;
    position: absolute;
    z-index: 3
}

.media img {
    object-fit: cover
}

.media img {
    border-radius: var(--radius)
}

.media img {
    aspect-ratio: var(--aspect-ratio, revert-layer)
}

.media.-aspect-3-2 {
    --aspect-ratio: 3 / 2
}

.media.-radius-none {
    --radius: 0
}

.section>.media {
    margin-left: 0;
    margin-right: 0
}

.paragraph {
    --size: var(--font-size-medium);
    color: var(--color-neutral);
    font-size: var(--size);
    flex-shrink: 1;
    line-height: calc(var(--size) + .75rem - var(--font-size-offset));
    min-width: 1em;
    text-wrap: pretty
}

.paragraph:empty {
    height: calc(var(--size) + .75rem - var(--font-size-offset))
}

.paragraph.-small {
    --size: var(--font-size-small)
}

.paragraph.-medium {
    --size: var(--font-size-medium)
}

.paragraph.-large {
    --size: var(--font-size-large)
}

.section {
    --base-padding: 80px;
    --mobile-coefficient: 1;
    --padding: calc(var(--base-padding) * var(--mobile-coefficient));
    align-content: start;
    background-color: var(--color-background, var(--color-background));
    background-position: center;
    background-size: cover;
    display: grid;
    grid-template-columns: minmax(0, 1fr) repeat(12, minmax(0, var(--column-width))) minmax(0, 1fr);
    column-gap: var(--gutter-width);
    padding: var(--padding) 0;
    position: relative
}

@container viewport (max-width: 1023px) {
    .section {
        column-gap: var(--gutter-width-small);
        grid-template-columns: minmax(0, 1fr) calc(100% - var(--gutter-width-small)*2) minmax(0, 1fr)
    }
}

.section.-medium {
    min-height: 66dvh
}

.section.-large {
    min-height: 100dvh
}

.section.-padding-0 {
    --base-padding: 0px
}

.section.-padding-16 {
    --base-padding: 16px
}

.section.-padding-32 {
    --base-padding: 32px
}

.section.-padding-120 {
    --base-padding: 120px
}

@container viewport (max-width: 768px) {
    .section {
        --mobile-coefficient: 0.75
    }
}

.section.-align-center {
    align-content: center
}

.section_image {
    inset: 0;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    position: absolute;
    user-select: none
}

.section_image+* {
    margin-top: 0 !important
}

.stack {
    align-items: flex-start;
    column-gap: 24px;
    display: flex;
    row-gap: 24px
}

.stack.-wrap {
    flex-wrap: wrap
}

.stack.-align-center {
    align-items: center
}

.stack.-justify-center {
    justify-content: flex-start
}

.stack.-justify-center {
    justify-content: center
}

.text.-tertiary {
    color: var(--color-tertiary)
}

.text.-left {
    text-align: left
}

.text.-center {
    text-align: center
}

.wrapper {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative
}

.wrapper.-align-center {
    justify-content: center
}

.site {
    --font-family-base: Lora, serif;
    --font-size-base-offset: 0px;
    --font-weight-base: 400;

    --font-family-heading: Space Grotesk, serif;
    --font-weight-heading: 700;

    --font-size-offset: 0px;
    --font-size-heading-offset: 0px;

    --color-background: #ffffff;
    --color-neutral: #34384f;

    --color-primary: #62bfad;
    --color-secondary: #d0ece6;
    --color-tertiary: #f9f7e8;

    --color-neutral-surface: #34384f;
    --color-neutral-foreground: #ffffff;
    --color-neutral-safe: #34384f;

    --color-primary-surface: #62bfad;
    --color-primary-foreground: #34384f;
    --color-primary-safe: #34384f;

    --color-secondary-surface: #d0ece6;
    --color-secondary-foreground: #34384f;
    --color-secondary-safe: #34384f;

    --color-tertiary-surface: #f9f7e8;
    --color-tertiary-foreground: #34384f;
    --color-tertiary-safe: #34384f;

    --color-shadow: #34384f;

    --alpha-offset-neutral: 1%;
}

@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 300 900;
    font-display: block;
    src: url('https://cdn.pagy.co/fonts/Lora.woff2') format('woff2');
}

@font-face {
    font-family: 'Lora';
    font-style: italic;
    font-weight: 300 900;
    font-display: block;
    src: url('https://cdn.pagy.co/fonts/Lora-Italic.woff2') format('woff2');
}

@font-face {
    font-family: 'Space Grotesk';
    font-style: normal;
    font-weight: 300 900;
    font-display: block;
    src: url('https://cdn.pagy.co/fonts/SpaceGrotesk.woff2') format('woff2');
}
/* Custom Styles for SimoGhana Website */

/* Base & Dark Mode Variables */
:root, .site {
  --font-family-base: 'Inter', sans-serif !important;
  --font-family-heading: 'Inter', sans-serif !important;
  
  /* Light Mode Colors - Overriding Original CSS */
  --color-background: #f8fafc !important;
  --color-neutral: #0f172a !important;
  
  /* Additional Custom Colors */
  --custom-text-muted: #334155;
  --custom-accent: #10b981;
  --custom-accent-hover: #059669;
  --custom-card-bg: #ffffff;
  --custom-button-text: #ffffff;
}

@media (prefers-color-scheme: dark) {
  :root, .site {
    /* Dark Mode Colors - Overriding Original CSS */
    --color-background: #0f172a !important;
    --color-neutral: #f8fafc !important;
    
    /* Additional Custom Colors */
    --custom-text-muted: #cbd5e1;
    --custom-accent: #34d399;
    --custom-accent-hover: #10b981;
    --custom-card-bg: #1e293b;
    --custom-button-text: #0f172a;
  }
}

/* Typography Overrides */
body, .body, .site {
  font-family: var(--font-family-base);
  color: var(--color-neutral) !important;
  background-color: var(--color-background) !important;
  line-height: 1.6;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Add smooth transitions to default sections so they change cleanly */
.section {
  transition: background-color 0.3s ease, color 0.3s ease;
}

h1, h2, h3, .heading {
  font-family: var(--font-family-heading);
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--color-neutral) !important;
}

/* Hero Section */
.hero-section {
  position: relative;
  overflow: hidden;
}

.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(15, 23, 42, 0.4) 0%, rgba(15, 23, 42, 0.7) 100%);
  z-index: 1;
}

.hero-image {
  z-index: 0;
}

/* Make sure text in hero sits above the overlay */
.hero-section > h1, 
.hero-section > p,
.hero-section > div {
  position: relative;
  z-index: 2;
}

/* Adjust text colors in hero for better contrast against dark overlay */
.hero-section .text.-tertiary {
  color: #ffffff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.6);
}

/* Custom Donation Button */
.custom-donation-button {
  background-color: var(--custom-accent) !important;
  color: var(--custom-button-text) !important;
  font-weight: 700 !important;
  font-size: 1.125rem !important;
  padding: 16px 36px !important;
  border-radius: 9999px !important;
  border: none !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.1) !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  cursor: pointer;
}

.custom-donation-button:hover {
  background-color: var(--custom-accent-hover) !important;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

.custom-donation-button:active {
  transform: translateY(0) scale(0.98);
}

/* Image Card Styling */
.media {
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  background-color: var(--custom-card-bg);
}

@media (prefers-color-scheme: dark) {
  .media {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3) !important;
  }
}

.media:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.15), 0 10px 10px -5px rgba(0, 0, 0, 0.08) !important;
}

@media (prefers-color-scheme: dark) {
  .media:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.7), 0 10px 10px -5px rgba(0, 0, 0, 0.5) !important;
  }
}

/* Styling links for better visibility */
a.link {
  color: var(--custom-accent) !important;
  text-decoration: none;
  font-weight: 600;
  border-bottom: 2px solid transparent;
  transition: border-bottom-color 0.2s ease, color 0.2s ease;
}

a.link:hover {
  border-bottom-color: var(--custom-accent);
  color: var(--custom-accent-hover) !important;
}

/* Improve readability of general paragraphs */
.paragraph.text {
  font-size: 1.125rem;
  color: var(--custom-text-muted) !important;
  line-height: 1.7;
}

/* Fix list item colors */
.list_item .text {
  color: var(--custom-text-muted) !important;
}

/* Additional Responsive Tweaks */
@media (max-width: 768px) {
  .custom-donation-button {
    width: 100%;
    padding: 16px 24px !important;
  }
  
  h1.heading {
    font-size: 2.5rem !important; /* Smaller heading on mobile */
    line-height: 1.2 !important;
  }
  
  .paragraph.text, .list_item .text {
    font-size: 1.05rem !important; /* Slightly smaller text on mobile */
  }
  
  /* Give the main layout container a small extra padding on very small screens if needed */
  .section {
    padding-left: 5% !important;
    padding-right: 5% !important;
  }
}