@font-face {
    font-family: "Averta";
    src: url("../fonts/Averta.woff2") format("woff2"),
         url("../fonts/Averta.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Averta";
    src: url("../fonts/Averta-Light.woff2") format("woff2"),
         url("../fonts/Averta-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Averta";
    src: url("../fonts/Averta-Bold.woff2") format("woff2"),
         url("../fonts/Averta-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --tj-font: "Averta", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    --tj-ink: #1c1c1e;
    --tj-muted: #8e8e93;
    --tj-bg: #f2f2f7;
    --tj-teal: #1db8ae;
    --tj-teal-dark: #12958d;
    --tj-navy: #1c1c1e;
    --tj-indigo: #05bed4;
    --tj-indigo-light: #3fe4f0;
    --tj-indigo-dark: #0499ad;
    --tj-indigo-rgb: 5, 190, 212;
    --tj-indigo-grad: linear-gradient(165deg, #3fe4f0 0%, #05bed4 52%, #0499ad 100%);
    --tj-green: #12b981;
    --tj-sand: #f2f2f7;
    --bs-primary: #1db8ae;
    --bs-primary-rgb: 29, 184, 174;
    --bs-link-color: #12958d;
    --bs-font-sans-serif: var(--tj-font);
    --bs-headings-font-family: var(--tj-font);
    --bs-headings-font-weight: 700;
    --bs-body-color: #1c1c1e;
    --bs-body-bg: #f2f2f7;
    --bs-border-radius: 0.9rem;
    --bs-border-radius-lg: 1.25rem;
}

body {
    min-height: 100vh;
    background: var(--tj-bg);
    font-family: var(--tj-font);
    color: var(--tj-ink);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .section-title, .brand, .navbar-brand {
    font-family: var(--tj-font);
    font-weight: 700;
    letter-spacing: -0.04em;
}

.brand,
.navbar-brand {
    display: inline-flex;
    align-items: baseline;
    gap: 0;
    color: var(--tj-ink) !important;
    text-decoration: none;
    font-size: 1.22rem;
    font-style: normal;
}

.brand-dot {
    color: #c7c7cc;
    font-weight: 500;
}

.brand-putujem {
    color: var(--tj-green);
}

.brand-admin {
    margin-left: .4rem;
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: 0;
    color: var(--tj-muted);
    text-transform: uppercase;
}

.brand-mark {
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--tj-teal);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    padding-top: env(safe-area-inset-top);
    background: rgba(255,255,255,.78);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border-bottom: .5px solid rgba(60, 60, 67, .08);
}

.site-header-bar {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 1rem;
    padding-top: .7rem;
    padding-bottom: .7rem;
}

.site-header-bar .brand {
    justify-self: start;
}

.site-nav {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 1.6rem;
}

.site-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    justify-self: end;
}

@media (min-width: 992px) {
    .site-header-bar {
        grid-template-columns: 1fr auto 1fr;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
    .site-nav {
        display: flex;
    }
}

.market-banner {
    background: transparent;
    color: var(--tj-muted);
    font-size: .75rem;
    font-weight: 500;
    padding: .15rem 0 .7rem;
    text-align: center;
}

.market-switch {
    position: relative;
}

.market-switch details {
    position: relative;
}

.market-toggle {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    list-style: none;
    cursor: pointer;
    border-radius: 999px;
    background: rgba(118, 118, 128, .12);
    padding: .38rem .7rem .38rem .42rem;
    font-size: .82rem;
    font-weight: 650;
    letter-spacing: -.02em;
    color: var(--tj-ink);
    max-width: 13.5rem;
}

.market-toggle::-webkit-details-marker,
.market-toggle::marker {
    display: none;
    content: "";
}

.market-toggle span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.market-caret {
    width: .65rem;
    height: .45rem;
    flex-shrink: 0;
    opacity: .55;
    transition: transform .2s ease;
}

.market-switch details[open] .market-caret {
    transform: rotate(180deg);
}

.market-flag {
    width: 1.35rem;
    height: 1rem;
    object-fit: cover;
    border-radius: 3px;
    flex-shrink: 0;
    box-shadow: 0 0 0 .5px rgba(60, 60, 67, .18);
}

.market-menu {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 40;
    min-width: 230px;
    padding: .4rem;
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .12);
}

.market-option {
    display: flex;
    align-items: center;
    gap: .7rem;
    width: 100%;
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: .55rem .7rem;
    font-size: .88rem;
    font-weight: 600;
    letter-spacing: -.02em;
    font-family: inherit;
    color: var(--tj-ink);
    text-align: left;
}

.market-option:hover,
.market-option.is-on {
    background: rgba(var(--tj-indigo-rgb), .08);
}

.market-option.is-on {
    color: var(--tj-indigo);
}

.site-menu {
    display: none;
    position: relative;
}

.site-menu details {
    position: relative;
}

.site-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    list-style: none;
    cursor: pointer;
    border: 0;
    border-radius: 14px;
    background: rgba(118, 118, 128, .12);
    color: var(--tj-ink);
}

.site-menu-toggle::-webkit-details-marker,
.site-menu-toggle::marker {
    display: none;
    content: "";
}

.site-menu-toggle svg {
    width: 1.35rem;
    height: 1.35rem;
}

.site-menu details[open] .site-menu-toggle {
    background: rgba(118, 118, 128, .22);
}

.site-menu-panel {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 50;
    width: min(18.5rem, calc(100vw - 1.6rem));
    padding: .7rem;
    border-radius: 20px;
    background: rgba(255,255,255,.94);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .14);
}

.site-menu-kicker {
    margin: 0 .35rem .45rem;
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #8e8e93;
}

.site-menu-flags {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .3rem;
}

.site-menu-flag {
    display: flex;
    align-items: center;
    gap: .45rem;
    width: 100%;
    min-height: 44px;
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: .4rem .5rem;
    font-size: .82rem;
    font-weight: 650;
    letter-spacing: -.02em;
    font-family: inherit;
    color: var(--tj-ink);
    text-align: left;
}

.site-menu-flag:hover,
.site-menu-flag.is-on {
    background: rgba(var(--tj-indigo-rgb), .08);
}

.site-menu-flag.is-on {
    color: var(--tj-indigo);
}

.site-menu-links {
    display: flex;
    flex-direction: column;
    margin-top: .55rem;
    padding-top: .45rem;
    border-top: .5px solid rgba(60, 60, 67, .12);
}

.site-menu-links a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: .35rem .55rem;
    border-radius: 12px;
    color: var(--tj-ink);
    text-decoration: none;
    font-size: .95rem;
    font-weight: 620;
    letter-spacing: -.02em;
}

.site-menu-links a:hover {
    background: rgba(118, 118, 128, .1);
}

.site-nav a,
.header-link {
    color: var(--tj-ink);
    text-decoration: none;
    font-weight: 590;
}

.form-label {
    font-size: .82rem;
    font-weight: 590;
    color: #636366;
}

.form-control,
.form-select {
    border-radius: 14px;
    min-height: 2.75rem;
    background: #fff;
    border: .5px solid rgba(60, 60, 67, .12);
    font-weight: 500;
    color: var(--tj-ink);
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(var(--tj-indigo-rgb), .45);
    box-shadow: 0 0 0 .2rem rgba(var(--tj-indigo-rgb), .12);
}

.btn-teal,
.btn-primary,
.btn-outline-teal,
.btn-outline-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: .7rem 1.25rem;
    line-height: 1.2;
}

.btn-teal,
.btn-primary {
    --bs-btn-bg: var(--tj-teal);
    --bs-btn-border-color: var(--tj-teal);
    --bs-btn-hover-bg: var(--tj-teal-dark);
    --bs-btn-hover-border-color: var(--tj-teal-dark);
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-font-weight: 600;
}

.btn-outline-teal,
.btn-outline-primary {
    --bs-btn-color: var(--tj-teal-dark);
    --bs-btn-border-color: var(--tj-teal);
    --bs-btn-hover-bg: var(--tj-teal);
    --bs-btn-hover-border-color: var(--tj-teal);
    --bs-btn-hover-color: #fff;
}

.btn-outline-teal,
.btn-outline-primary {
    --bs-btn-color: var(--tj-teal-dark);
    --bs-btn-border-color: var(--tj-teal);
    --bs-btn-hover-bg: var(--tj-teal);
    --bs-btn-hover-border-color: var(--tj-teal);
    --bs-btn-hover-color: #fff;
}

.hero-photo {
    min-height: 78vh;
    background:
        linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.12) 28%, rgba(22,50,79,.18) 100%),
        url('https://images.unsplash.com/photo-1613395877344-13d4a8e0d49e?auto=format&fit=crop&w=2000&q=80') center/cover no-repeat;
    padding: 4.5rem 0 5rem;
}

.home-page {
    background: var(--tj-bg);
    color: var(--tj-ink);
}

.home-page h1,
.home-page h2,
.home-page h3,
.home-page .brand {
    font-style: normal;
    font-weight: 700;
    letter-spacing: -.04em;
}

.home-page .btn-teal,
.home-page .btn-primary,
.mode-tipujem .btn-teal,
.mode-tipujem .btn-primary {
    --bs-btn-bg: var(--tj-indigo);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: var(--tj-indigo-dark);
    --bs-btn-hover-border-color: transparent;
    background-image: var(--tj-indigo-grad);
    border-radius: 999px;
    font-weight: 600;
    letter-spacing: -.01em;
    box-shadow: 0 8px 24px rgba(var(--tj-indigo-rgb), .32);
}

.home-page .btn-teal:hover,
.home-page .btn-primary:hover,
.mode-tipujem .btn-teal:hover,
.mode-tipujem .btn-primary:hover {
    background-image: linear-gradient(165deg, #05bed4 0%, #0499ad 100%);
}

.home-page .btn-outline-teal,
.mode-tipujem .btn-outline-teal,
.mode-tipujem .btn-outline-primary {
    --bs-btn-color: var(--tj-indigo);
    --bs-btn-border-color: rgba(var(--tj-indigo-rgb), .35);
    --bs-btn-hover-bg: var(--tj-indigo);
    --bs-btn-hover-color: #fff;
    border-radius: 999px;
}

.mode-putujem .btn-teal,
.mode-putujem .btn-primary {
    --bs-btn-bg: var(--tj-green);
    --bs-btn-border-color: var(--tj-green);
    --bs-btn-hover-bg: #0f9f70;
    --bs-btn-hover-border-color: #0f9f70;
    border-radius: 999px;
    font-weight: 600;
    box-shadow: 0 8px 24px rgba(18, 185, 129, .28);
}

.mode-putujem .btn-outline-teal,
.mode-putujem .btn-outline-primary {
    --bs-btn-color: #0f9f70;
    --bs-btn-border-color: rgba(18, 185, 129, .4);
    --bs-btn-hover-bg: var(--tj-green);
    --bs-btn-hover-color: #fff;
}

.hero-stage {
    position: relative;
    min-height: 88vh;
    display: flex;
    align-items: center;
    padding: 7.5rem 0 6.5rem;
    overflow: hidden;
    color: #fff;
}

.hero-media {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,.18) 38%, rgba(242,242,247,.08) 78%, #f2f2f7 100%),
        url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=2200&q=80') center/cover no-repeat;
}

.hero-media::after {
    content: "";
    position: absolute;
    inset: -10% -30%;
    background: linear-gradient(115deg, transparent 28%, rgba(255,255,255,.22) 48%, rgba(94, 240, 228, .16) 52%, transparent 72%);
    animation: glass-sheen 10s ease-in-out infinite;
    pointer-events: none;
}

@keyframes glass-sheen {
    0%, 100% { transform: translateX(-12%) rotate(2deg); opacity: .45; }
    50% { transform: translateX(14%) rotate(-1deg); opacity: .7; }
}

.hero-inner {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 920px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    background: rgba(255,255,255,.18);
    backdrop-filter: saturate(200%) blur(22px);
    -webkit-backdrop-filter: saturate(200%) blur(22px);
    border: .5px solid rgba(255,255,255,.38);
    color: #fff;
    border-radius: 999px;
    padding: .38rem .9rem;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: -.01em;
    margin-bottom: 1.15rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}

.hero-stage h1 {
    font-size: clamp(2.4rem, 6.4vw, 4.6rem);
    line-height: 1.02;
    font-weight: 700;
    max-width: 13ch;
    margin: 0 auto .9rem;
    color: #fff;
}

.hero-stage h1 span {
    color: #5ef0e4;
}

.hero-stage .hero-sub {
    font-size: 1.05rem;
    line-height: 1.45;
    font-weight: 400;
    letter-spacing: -.01em;
    color: rgba(255,255,255,.86);
    max-width: 32rem;
    margin: 0 auto 1.6rem;
}

.search-shell {
    max-width: 780px;
}

.search-tabs {
    display: inline-flex;
    background: rgba(118, 118, 128, .32);
    backdrop-filter: saturate(180%) blur(16px);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    border-radius: 9px;
    padding: 2px;
    margin-bottom: .85rem;
}

.search-tab {
    border: 0;
    background: transparent;
    border-radius: 7px;
    padding: .4rem .95rem;
    font-size: .82rem;
    font-weight: 590;
    color: rgba(255,255,255,.82);
}

.search-tab.active {
    background: rgba(255,255,255,.92);
    color: #1c1c1e;
    box-shadow: 0 1px 4px rgba(0,0,0,.12);
}

.search-card {
    background: rgba(255,255,255,.42);
    backdrop-filter: saturate(200%) blur(40px);
    -webkit-backdrop-filter: saturate(200%) blur(40px);
    border: .5px solid rgba(255,255,255,.62);
    border-radius: 28px;
    padding: .5rem;
    box-shadow: 0 12px 48px rgba(0, 0, 0, .14), inset 0 1px 0 rgba(255,255,255,.65);
}

.search-grid,
.search-quick {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    align-items: stretch;
}

.search-field {
    display: flex;
    gap: .7rem;
    align-items: center;
    padding: .5rem .95rem;
    min-width: 170px;
    flex: 1;
}

.search-field label {
    display: block;
    font-size: .68rem;
    font-weight: 590;
    color: #8e8e93;
    margin: 0;
    letter-spacing: -.01em;
}

.search-field input,
.search-field select {
    border: 0;
    outline: none;
    width: 100%;
    background: transparent;
    font-weight: 590;
    font-size: 1.02rem;
    color: #1c1c1e;
}

.search-submit {
    white-space: nowrap;
    min-height: 3.15rem;
    padding-left: 1.15rem;
    padding-right: 1.15rem;
}

.hero-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .4rem;
    margin-top: 1.15rem;
}

.hero-pills span {
    background: rgba(255,255,255,.16);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: .5px solid rgba(255,255,255,.18);
    border-radius: 999px;
    padding: .32rem .72rem;
    font-size: .75rem;
    font-weight: 510;
    color: rgba(255,255,255,.92);
}

.home-sheet {
    position: relative;
    z-index: 2;
    margin-top: -1.2rem;
    background:
        radial-gradient(720px 380px at 12% -10%, rgba(94, 240, 228, .22), transparent 55%),
        radial-gradient(640px 360px at 92% 8%, rgba(90, 170, 255, .16), transparent 50%),
        rgba(242, 242, 247, .78);
    backdrop-filter: saturate(160%) blur(28px);
    -webkit-backdrop-filter: saturate(160%) blur(28px);
    border-radius: 32px 32px 0 0;
    border-top: .5px solid rgba(255,255,255,.7);
    box-shadow: 0 -12px 40px rgba(0,0,0,.08);
}

.home-sheet::before {
    content: "";
    display: block;
    width: 36px;
    height: 5px;
    border-radius: 999px;
    background: rgba(60, 60, 67, .18);
    margin: 18px auto 0;
}

.home-panel {
    padding: 4.4rem 0 3.2rem;
}

.home-panel + .home-panel {
    padding-top: 1.6rem;
}

.home-panel:last-child {
    padding-bottom: 5.2rem;
}

.home-panel-head {
    max-width: 36rem;
    margin: 0 auto 2rem;
    text-align: center;
}

.home-panel-head h2 {
    font-size: clamp(1.55rem, 3vw, 2.05rem);
    margin-bottom: .4rem;
    color: #1c1c1e;
}

.home-panel-head p {
    color: #8e8e93;
    margin: 0;
    font-size: .98rem;
    letter-spacing: -.01em;
}

.how-track {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

.how-card {
    display: flex;
    align-items: flex-start;
    gap: 1.15rem;
    background: rgba(255,255,255,.58);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.78);
    border-radius: 22px;
    padding: 1.45rem 1.4rem 1.5rem;
    min-height: 0;
    box-shadow: 0 8px 28px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.8);
}

.how-card span {
    flex-shrink: 0;
    display: block;
    width: 3.4rem;
    line-height: .9;
    background: none;
    color: #0f9d94;
    font-size: 3.4rem;
    font-weight: 700;
    letter-spacing: -.08em;
    margin: 0;
    text-align: left;
}

.how-card h3 {
    margin: .15rem 0 0;
    font-size: 1.18rem;
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 1.2;
    color: #1c1c1e;
}

.how-card p {
    margin: .35rem 0 0;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -.015em;
    line-height: 1.4;
    color: #1c1c1e;
    text-align: left;
}

.how-card h3 + p {
    margin-top: .4rem;
    font-size: .95rem;
    color: #636366;
}

.story-carousel {
    overflow: hidden;
    margin-top: .2rem;
    mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.story-track {
    display: flex;
    width: max-content;
    animation: story-marquee 42s linear infinite;
    animation-delay: calc(var(--story-shift, 0s) * -1);
}

.story-set {
    display: flex;
    gap: 16px;
    padding-right: 16px;
}

.story-card {
    position: relative;
    isolation: isolate;
    flex: 0 0 min(78vw, 300px);
    width: min(78vw, 300px);
    min-height: 248px;
    border-radius: 24px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    background: #fff;
    border: .5px solid rgba(60, 60, 67, .08);
    box-shadow: 0 14px 36px rgba(28, 28, 30, .08);
}

.story-country {
    position: absolute;
    top: 2.15rem;
    left: 1.15rem;
    right: 1.15rem;
    z-index: 1;
    margin: 0;
    font-size: clamp(2.1rem, 7vw, 3.85rem);
    font-weight: 700;
    letter-spacing: -.07em;
    line-height: .84;
    text-transform: uppercase;
    color: #efefef;
}

.story-copy {
    position: relative;
    z-index: 1;
    margin: .85rem;
    padding: .95rem 1.05rem;
    border-radius: 18px;
    width: calc(100% - 1.7rem);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22);
}

.story-card[data-iso="EG"] .story-copy {
    background: linear-gradient(165deg, #d7b57a 0%, #c49a58 100%);
}
.story-card[data-iso="GR"] .story-copy {
    background: linear-gradient(165deg, #5aa4d4 0%, #2c7ab0 100%);
}
.story-card[data-iso="ME"] .story-copy {
    background: linear-gradient(165deg, #3ecfbf 0%, #1a8f86 100%);
}
.story-card[data-iso="TR"] .story-copy {
    background: linear-gradient(165deg, #e07a5a 0%, #c45c3e 100%);
}
.story-card[data-iso="HR"] .story-copy {
    background: linear-gradient(165deg, #6aa8d8 0%, #3d7fb8 100%);
}
.story-card[data-iso="AL"] .story-copy {
    background: linear-gradient(165deg, #c45c5c 0%, #a83d3d 100%);
}

.story-copy small {
    display: block;
    color: rgba(255,255,255,.82);
    font-size: .72rem;
    font-weight: 590;
    letter-spacing: .01em;
    margin-bottom: .3rem;
}

.story-copy p {
    margin: 0;
    font-size: .98rem;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.3;
    color: #fff;
}

@keyframes story-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
    .story-carousel {
        overflow-x: auto;
        mask-image: none;
        -webkit-mask-image: none;
    }
    .story-track { animation: none; }
    .story-set[aria-hidden="true"] { display: none; }
}

.ios-group {
    background: rgba(255,255,255,.58);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.78);
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.8);
}

.ios-row {
    padding: 1.05rem 1.15rem;
    border-bottom: .5px solid rgba(60, 60, 67, .12);
}

.ios-row:last-child {
    border-bottom: 0;
}

.ios-row h3 {
    font-size: 1.02rem;
    margin-bottom: .2rem;
    color: #1c1c1e;
}

.ios-row p {
    margin: 0;
    color: #8e8e93;
    font-size: .9rem;
    letter-spacing: -.01em;
}

.home-page .site-footer,
.site-footer {
    background: var(--tj-bg);
    color: var(--tj-muted);
    border-top: .5px solid rgba(60, 60, 67, .12);
}

.home-page .site-footer .brand,
.home-page .site-footer a,
.site-footer .brand {
    color: var(--tj-ink) !important;
}

.home-page .site-footer .text-muted,
.site-footer .text-muted {
    color: var(--tj-muted) !important;
}

.respond-banner {
    background: #fff6e8;
    border: 1px solid #ead0a8;
    border-radius: .8rem;
    padding: .85rem 1rem;
    margin-bottom: 1.25rem;
    color: #8a5a2b;
}

.respond-banner.is-closed {
    background: #f4f1ec;
    border-color: #e0d9ce;
    color: #64748b;
}

.respond-timer {
    --respond: #12b981;
}

.respond-timer.is-warn {
    --respond: #f59e0b;
}

.respond-timer.is-hot {
    --respond: #ef4444;
}

.respond-timer.is-expired {
    --respond: #78716c;
}

.respond-timer.is-closed {
    --respond: #4f46e5;
}

.respond-timer-hero {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.1rem 1.35rem;
    align-items: center;
    padding: 1.05rem 1.15rem;
    border-radius: 22px;
    background:
        radial-gradient(180px 120px at 0% 0%, color-mix(in srgb, var(--respond) 18%, transparent), transparent 70%),
        rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .06);
}

.respond-ring {
    position: relative;
    width: 7.4rem;
    height: 7.4rem;
    flex-shrink: 0;
}

.respond-ring svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.respond-ring-track,
.respond-ring-bar {
    fill: none;
    stroke-width: 9;
}

.respond-ring-track {
    stroke: rgba(60, 60, 67, .1);
}

.respond-ring-bar {
    stroke: var(--respond);
    stroke-linecap: round;
    transition: stroke-dashoffset .6s ease, stroke .3s ease;
}

.respond-ring-copy {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.respond-clock {
    font-variant-numeric: tabular-nums;
    font-weight: 780;
    letter-spacing: -.04em;
    line-height: 1;
}

.respond-ring-copy .respond-clock {
    font-size: 1.05rem;
}

.respond-ring-copy small {
    margin-top: .28rem;
    font-size: .68rem;
    font-weight: 650;
    color: var(--tj-muted);
    letter-spacing: .02em;
    text-transform: uppercase;
}

.respond-hero-kicker {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--respond);
    margin-bottom: .15rem;
}

.respond-hero-until {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -.02em;
    margin-bottom: .65rem;
}

.respond-hero-help {
    margin: .65rem 0 0;
    color: var(--tj-muted);
    font-size: .82rem;
}

.respond-bar {
    height: .42rem;
    border-radius: 999px;
    background: rgba(60, 60, 67, .1);
    overflow: hidden;
}

.respond-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--respond);
    transition: width .6s ease, background .3s ease;
}

.respond-timer-card .respond-mini-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .6rem;
    margin-bottom: .4rem;
}

.respond-timer-card .respond-clock {
    font-size: .98rem;
    color: var(--respond);
}

.respond-mini-label {
    font-size: .72rem;
    font-weight: 650;
    color: var(--tj-muted);
    letter-spacing: .02em;
    text-transform: uppercase;
}

.respond-timer.is-hot .respond-clock {
    animation: respond-pulse 1.2s ease-in-out infinite;
}

@keyframes respond-pulse {
    50% { opacity: .55; }
}

.req-spec-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
    margin-bottom: 1.1rem;
}

.req-spec {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: .85rem 1rem;
    border-radius: 16px;
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.8);
}

.req-spec span {
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.req-spec strong {
    font-size: .95rem;
    font-weight: 700;
    letter-spacing: -.02em;
}

.req-notes {
    padding: 1rem 1.1rem;
    border-radius: 16px;
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.8);
    margin-bottom: 1rem;
}

.req-notes-kicker {
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tj-muted);
    margin-bottom: .35rem;
}

.req-notes p {
    margin: 0;
    font-weight: 550;
}

.req-contact-hint {
    color: var(--tj-muted);
    font-size: .88rem;
    margin-bottom: 1.25rem;
}

.req-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .7rem;
}

.req-intent {
    font-size: .72rem;
    font-weight: 650;
    color: #0f9d94;
    background: rgba(18, 185, 129, .12);
    border-radius: 999px;
    padding: .22rem .55rem;
}

.req-status {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .02em;
    border-radius: 999px;
    padding: .22rem .55rem;
}

.req-card.is-expired .req-status,
.req-detail.is-expired .req-status {
    color: #57534e;
    background: rgba(120, 113, 108, .18);
}

.req-card.is-closed .req-status,
.req-detail.is-closed .req-status {
    color: #4338ca;
    background: rgba(79, 70, 229, .14);
}

.req-card.is-expired {
    background: linear-gradient(180deg, rgba(168, 162, 158, .16), rgba(255,255,255,.5));
    outline: 1.5px solid rgba(120, 113, 108, .28);
}

.req-card.is-expired:hover {
    box-shadow: 0 16px 36px rgba(68, 64, 60, .12);
    outline-color: rgba(120, 113, 108, .45);
}

.req-card.is-closed {
    background: linear-gradient(180deg, rgba(99, 102, 241, .12), rgba(255,255,255,.52));
    outline: 1.5px solid rgba(79, 70, 229, .28);
}

.req-card.is-closed:hover {
    box-shadow: 0 16px 36px rgba(67, 56, 202, .12);
    outline-color: rgba(79, 70, 229, .45);
}

.req-card.is-expired .page-kicker,
.req-card.is-expired .req-card-title {
    color: #57534e;
}

.req-card.is-closed .page-kicker,
.req-card.is-closed .req-card-title {
    color: #3730a3;
}

.req-card.is-won {
    background:
        linear-gradient(165deg, rgba(16, 185, 129, .2) 0%, rgba(255,255,255,.72) 48%);
    outline: 1.5px solid rgba(5, 150, 105, .32);
}

.req-card.is-won:hover {
    box-shadow: 0 18px 40px rgba(4, 120, 87, .16);
    outline-color: rgba(5, 150, 105, .5);
}

.req-card.is-won .page-kicker {
    color: #047857;
}

.req-card.is-won .req-status {
    color: #065f46;
    background: rgba(16, 185, 129, .18);
}

.req-won-amount {
    margin: .85rem 0 .35rem;
}

.req-won-amount span {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #059669;
    margin-bottom: .2rem;
}

.req-won-amount strong {
    display: block;
    font-size: clamp(2.2rem, 5vw, 3.1rem);
    font-weight: 800;
    letter-spacing: -.07em;
    line-height: .95;
    color: #047857;
    font-variant-numeric: tabular-nums;
}

.req-card.is-won .req-card-foot {
    color: #047857;
    font-weight: 650;
}

.book-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.6rem;
}

.book-won {
    margin: 0;
    text-align: right;
}

.book-offer {
    padding: 1.15rem 1.2rem 1.2rem;
    border-radius: 18px;
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.8);
    margin-bottom: 1.4rem;
}

.book-offer-title {
    font-size: 1.2rem;
    font-weight: 750;
    letter-spacing: -.03em;
}

.book-offer-hotel {
    color: var(--tj-muted);
    font-weight: 600;
    margin-top: .15rem;
}

.book-offer-copy {
    margin: 1rem 0 0;
    color: var(--tj-ink);
}

.book-offer-list {
    margin-top: .9rem;
}

.book-offer-list ul {
    margin: .25rem 0 0;
    padding-left: 1.1rem;
}

.book-offer-list p {
    margin: .25rem 0 0;
}

.book-contact {
    padding: 1.15rem 1.2rem;
    border-radius: 18px;
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.8);
}

.book-contact-name {
    font-size: 1.25rem;
    font-weight: 750;
    letter-spacing: -.03em;
    margin-bottom: .25rem;
}

.book-contact a {
    display: block;
    color: #047857;
    font-weight: 650;
    text-decoration: none;
}

.book-contact .book-action {
    display: flex;
    color: #fff;
}

.book-contact .book-action.is-mail {
    color: #047857;
}

.book-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .65rem;
    margin-top: 1rem;
}

.book-action {
    display: flex;
    flex-direction: column;
    gap: .18rem;
    min-width: 0;
    padding: .9rem 1rem;
    border-radius: 16px;
    text-decoration: none;
    color: #fff;
    background: #12b981;
}

.book-action.is-mail {
    background: rgba(18, 185, 129, .14);
    color: #047857;
}

.book-action span {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    opacity: .82;
}

.book-action strong {
    font-size: .95rem;
    font-weight: 750;
    letter-spacing: -.02em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.book-web {
    display: inline-block;
    margin-top: .85rem;
    font-weight: 650;
    color: #047857;
    text-decoration: none;
}

.traveler-book .book-head {
    align-items: flex-end;
}

.traveler-book .traveler-section {
    margin-bottom: 1.7rem;
}

@media (max-width: 640px) {
    .book-won {
        text-align: left;
        width: 100%;
    }

    .book-actions {
        grid-template-columns: 1fr;
    }
}

.respond-timer-hero.is-expired {
    background:
        radial-gradient(180px 120px at 0% 0%, rgba(120, 113, 108, .18), transparent 70%),
        rgba(245, 245, 244, .88);
}

.respond-timer-hero.is-closed {
    background:
        radial-gradient(180px 120px at 0% 0%, rgba(79, 70, 229, .16), transparent 70%),
        rgba(238, 242, 255, .88);
}

.req-card-meta {
    margin-top: .2rem;
    font-size: .92rem;
}

.req-card-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: .75rem;
}

.req-back {
    margin-bottom: .35rem;
}

@media (max-width: 640px) {
    .respond-timer-hero {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }
    .respond-hero-copy {
        width: 100%;
    }
    .req-spec-grid {
        grid-template-columns: 1fr;
    }
}

.section-title {
    font-size: 1.7rem;
}

.dest-card {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 1.2rem;
    min-height: 280px;
    color: #fff;
    text-decoration: none;
}

.dest-card img {
    width: 100%;
    height: 280px;
    object-fit: cover;
}

.dest-card-label {
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    display: flex;
    flex-direction: column;
    text-shadow: 0 8px 20px rgba(0,0,0,.45);
}

.value-bar {
    background: #f6f8fb;
    padding: 2.5rem 0;
}

.value-ico {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: .7rem;
    background: #e7f8f6;
    color: var(--tj-teal-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: .6rem;
}

.traveler-dash {
    padding-top: 2.2rem;
    padding-bottom: 4rem;
    max-width: 980px;
}

.traveler-dash-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.traveler-dash h1 {
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    letter-spacing: -.04em;
    margin-bottom: .35rem;
}

.traveler-next {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 1.15rem 1.25rem;
    border-radius: 22px;
    margin-bottom: 1.2rem;
    background:
        linear-gradient(165deg, rgba(var(--tj-indigo-rgb), .16), rgba(255,255,255,.78) 55%);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .06);
}

.traveler-next span {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--tj-indigo);
    margin-bottom: .25rem;
}

.traveler-next strong {
    display: block;
    font-size: 1.2rem;
    letter-spacing: -.03em;
}

.traveler-next em {
    display: block;
    margin-top: .3rem;
    font-style: normal;
    color: var(--tj-muted);
    font-weight: 500;
}

.traveler-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .7rem;
    margin-bottom: 1.8rem;
}

.traveler-stat {
    padding: .85rem 1rem;
    border-radius: 16px;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
}

.traveler-stat span {
    display: block;
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.traveler-stat strong {
    display: block;
    font-size: 1.55rem;
    font-weight: 780;
    letter-spacing: -.04em;
    line-height: 1.15;
    margin-top: .1rem;
}

.traveler-stat.is-ready strong {
    color: var(--tj-indigo);
}

.traveler-section {
    margin-bottom: 2.2rem;
}

.traveler-section h2 {
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: -.03em;
    margin-bottom: .2rem;
}

.traveler-section-help {
    color: var(--tj-muted);
    font-size: .92rem;
    margin-bottom: .9rem;
}

.td-card {
    display: block;
    height: 100%;
    padding: 1.15rem 1.25rem;
    border-radius: 22px;
    text-decoration: none;
    color: inherit;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 10px 32px rgba(15, 23, 42, .06);
}

.td-card:hover {
    outline: 1.5px solid rgba(var(--tj-indigo-rgb), .28);
    box-shadow: 0 16px 36px rgba(15, 23, 42, .1);
}

.td-card.has-offers {
    outline: 1.5px solid rgba(var(--tj-indigo-rgb), .22);
}

.td-card.is-won {
    background: linear-gradient(165deg, rgba(16, 185, 129, .16), rgba(255,255,255,.72) 50%);
}

.td-card.is-booked {
    background: linear-gradient(165deg, rgba(14, 165, 233, .14), rgba(255,255,255,.72) 50%);
}

.td-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .6rem;
}

.td-card-title {
    font-size: 1.3rem;
    font-weight: 750;
    letter-spacing: -.03em;
    margin-top: .4rem;
}

.td-card-meta {
    margin-top: .2rem;
    font-size: .92rem;
}

.td-card-cta {
    margin-top: .9rem;
    font-size: .88rem;
    font-weight: 700;
    color: var(--tj-indigo);
}

.td-card.is-won .td-card-cta {
    color: #047857;
}

.td-pill {
    font-size: .72rem;
    font-weight: 700;
    border-radius: 999px;
    padding: .22rem .55rem;
    background: rgba(118, 118, 128, .12);
    color: #636366;
    white-space: nowrap;
}

.td-pill.is-ready {
    background: rgba(var(--tj-indigo-rgb), .12);
    color: var(--tj-indigo);
}

.td-pill.is-won {
    background: rgba(16, 185, 129, .18);
    color: #065f46;
}

.td-pill.is-booked {
    background: rgba(14, 165, 233, .16);
    color: #0369a1;
}

.td-past a {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 0;
    border-bottom: .5px solid rgba(60, 60, 67, .1);
    text-decoration: none;
    color: inherit;
    font-weight: 600;
}

.td-past em {
    font-style: normal;
    color: var(--tj-muted);
    font-weight: 600;
}

.traveler-empty {
    padding: 1.6rem 1.4rem 1.5rem;
    border-radius: 24px;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    text-align: center;
}

.traveler-empty h2 {
    font-size: 1.45rem;
    letter-spacing: -.03em;
}

.traveler-empty p {
    color: var(--tj-muted);
    max-width: 32rem;
    margin: .4rem auto 1.1rem;
}

.traveler-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    text-align: left;
    margin-top: 1.6rem;
}

.traveler-steps b {
    display: inline-flex;
    width: 1.7rem;
    height: 1.7rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(var(--tj-indigo-rgb), .12);
    color: var(--tj-indigo);
    font-size: .8rem;
    margin-bottom: .45rem;
}

.traveler-steps strong {
    display: block;
    margin-bottom: .2rem;
}

.traveler-steps span {
    display: block;
    color: var(--tj-muted);
    font-size: .88rem;
}

@media (max-width: 767px) {
    .traveler-stats,
    .traveler-steps {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 520px) {
    .traveler-steps {
        grid-template-columns: 1fr;
    }
}

.stat-card {
    background: #fff;
    border-radius: 22px;
    padding: 1.25rem 1.4rem;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
}

.price {
    font-weight: 700;
    color: var(--tj-teal-dark);
}

.step-dot {
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    font-weight: 700;
    background: #e7e5e4;
    color: #57534e;
}

.step-dot.active,
.step-dot.done {
    background: var(--tj-teal);
    color: #fff;
}

.sidebar-nav .nav-link {
    color: var(--tj-ink);
    border-radius: 12px;
    padding: 0.7rem 0.9rem;
    font-weight: 590;
}

.sidebar-nav .nav-link.active,
.sidebar-nav .nav-link:hover {
    background: rgba(var(--tj-indigo-rgb), .08);
    color: var(--tj-indigo);
}

.agency-app .sidebar-nav .nav-link.active,
.agency-app .sidebar-nav .nav-link:hover {
    background: rgba(18, 185, 129, .12);
    color: #0f9f70;
}

.dest-suggest {
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    top: calc(100% + .25rem);
    background: #fff;
    border-radius: .9rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
    max-height: 280px;
    overflow-y: auto;
    padding: .35rem;
}

.dest-suggest-item,
.dest-suggest-empty {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    padding: .55rem .75rem;
    border-radius: .7rem;
    color: #1e293b;
}

.dest-suggest-item:hover,
.dest-suggest-item:focus {
    background: #ecfdf8;
}

.dest-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.dest-chip {
    border: 0;
    background: #ecfdf8;
    color: var(--tj-teal-dark);
    border-radius: 999px;
    padding: .25rem .7rem;
    font-size: .85rem;
}

.dest-row .form-check-label {
    font-weight: 500;
}

.wizard-pane { display: none; }
.wizard-pane.active { display: block; }
.offer-compare { min-width: 280px; }

.traveler-request {
    padding-top: 1.6rem;
    padding-bottom: 4rem;
    max-width: 1100px;
}

.traveler-request h1 {
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    letter-spacing: -.04em;
    margin-bottom: .2rem;
}

.req-folds {
    display: grid;
    gap: .55rem;
    margin: .85rem 0 1.35rem;
}

.req-fold {
    background: rgba(255,255,255,.74);
    border: .5px solid rgba(255,255,255,.88);
    border-radius: 18px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
    overflow: hidden;
}

.req-fold summary {
    list-style: none;
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .92rem 1.05rem;
    cursor: pointer;
    user-select: none;
}

.req-fold summary::-webkit-details-marker,
.req-fold summary::marker {
    display: none;
    content: "";
}

.req-fold-title {
    font-weight: 750;
    letter-spacing: -.02em;
    flex: 0 1 auto;
}

.req-fold-meta {
    margin-left: auto;
    min-width: 0;
    max-width: 58%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
    font-size: .88rem;
    font-weight: 650;
    color: var(--tj-muted);
}

.req-fold summary::after {
    content: "";
    width: .48rem;
    height: .48rem;
    margin-top: -.12rem;
    border-right: 1.8px solid currentColor;
    border-bottom: 1.8px solid currentColor;
    transform: rotate(45deg);
    opacity: .38;
    flex-shrink: 0;
}

.req-fold[open] summary::after {
    transform: rotate(225deg);
    margin-top: .18rem;
}

.req-fold-body {
    padding: 0 1.05rem 1.05rem;
}

.req-fold .req-spec-grid {
    margin-bottom: 0;
}

.req-fold .req-notes {
    margin: .7rem 0 0;
}

@media (max-width: 640px) {
    .req-fold-meta {
        max-width: 46%;
        font-size: .8rem;
    }
}

.offer-board {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}

.offer-card {
    display: flex;
    flex-direction: column;
    padding: 1.2rem 1.25rem 1.15rem;
    border-radius: 22px;
    background: rgba(255,255,255,.78);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .06);
}

.offer-card.is-best {
    outline: 1.5px solid rgba(var(--tj-indigo-rgb), .35);
}

.offer-card.is-selected {
    outline: 1.5px solid rgba(5, 150, 105, .4);
    background: linear-gradient(180deg, rgba(16, 185, 129, .12), rgba(255,255,255,.8) 42%);
}

.offer-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
    margin-bottom: .35rem;
}

.offer-agency {
    font-size: .78rem;
    font-weight: 700;
    color: var(--tj-muted);
    letter-spacing: .02em;
    text-transform: uppercase;
}

.offer-card h3 {
    font-size: 1.12rem;
    font-weight: 750;
    letter-spacing: -.03em;
    margin: 0 0 .2rem;
}

.offer-hotel {
    color: var(--tj-muted);
    font-weight: 600;
}

.offer-price {
    font-size: clamp(1.8rem, 4vw, 2.35rem);
    font-weight: 800;
    letter-spacing: -.06em;
    color: var(--tj-teal-dark);
    margin: .65rem 0 .5rem;
    font-variant-numeric: tabular-nums;
}

.offer-facts {
    margin: 0 0 .7rem;
    padding-left: 1.05rem;
    color: var(--tj-ink);
    font-size: .92rem;
}

.offer-copy {
    font-size: .9rem;
    margin: 0 0 .7rem;
}

.offer-extra {
    font-size: .82rem;
    margin-bottom: .35rem;
}

.offer-extra strong {
    display: block;
    font-size: .72rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.offer-choose-help {
    margin: .55rem 0 0;
    font-size: .78rem;
    color: var(--tj-muted);
}

.site-footer-links {
    align-items: center;
}

.site-footer a {
    color: var(--tj-ink);
    text-decoration: none;
    font-weight: 590;
    white-space: nowrap;
}

.blog-card {
    display: block;
    height: 100%;
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 10px 32px rgba(15, 23, 42, 0.06);
}

.blog-wrap {
    padding-top: 3.4rem;
    padding-bottom: 4rem;
}

.blog-back {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    min-height: 44px;
    margin: 0 0 .7rem;
    padding: 0 .95rem 0 .5rem;
    border-radius: 999px;
    background: rgba(118, 118, 128, .12);
    color: var(--tj-ink);
    text-decoration: none;
    font-size: .92rem;
    font-weight: 650;
    letter-spacing: -.02em;
}

.blog-back svg {
    width: 1.15rem;
    height: 1.15rem;
}

.blog-back:hover {
    background: rgba(118, 118, 128, .2);
    color: var(--tj-ink);
}

@media (max-width: 991px) {
    .blog-wrap {
        padding-top: 1.5rem;
        padding-bottom: 3rem;
    }
    .blog-index-kicker {
        display: none;
    }
}

.blog-card img,
.blog-hero {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    object-fit: cover;
}

.blog-hero {
    border-radius: 1.2rem;
}

.blog-body {
    font-size: 1.05rem;
    line-height: 1.7;
}

.blog-body p { margin-bottom: 1rem; }

.blog-body h2 {
    font-size: 1.4rem;
    line-height: 1.25;
    margin: 2rem 0 .7rem;
    letter-spacing: -.03em;
}

.blog-body ul,
.blog-body ol {
    margin: 0 0 1.1rem;
    padding-left: 1.2rem;
}

.blog-body li { margin-bottom: .35rem; }

.blog-langs {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1rem;
    align-items: center;
}

.blog-langs a {
    color: var(--tj-teal-dark);
    text-decoration: none;
    font-weight: 600;
}

.docs-code {
    background: #16324f;
    color: #e7f8f6;
    border-radius: 1rem;
    padding: 1.1rem 1.25rem;
    font-size: .85rem;
    overflow-x: auto;
}

.social-proof {
    background: #f7f4ee;
}

.social-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.social-card {
    background: #fff;
    border-radius: 1.2rem;
    padding: 1.2rem 1.3rem;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.social-avatar {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 999px;
    background: var(--tj-teal);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    margin-bottom: .75rem;
}

.social-when {
    color: #64748b;
    font-size: .82rem;
}

.agency-app {
    background:
        radial-gradient(620px 340px at 0% -8%, rgba(18, 185, 129, .16), transparent 52%),
        radial-gradient(520px 280px at 100% 0%, rgba(29, 184, 174, .1), transparent 46%),
        var(--tj-bg);
    color: var(--tj-ink);
}

.agency-shell {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    min-height: 100vh;
}

.agency-sidebar {
    background: rgba(255,255,255,.62);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border-right: .5px solid rgba(60, 60, 67, .1);
}

.agency-app .agency-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.35rem 1.1rem 1.2rem;
}

.agency-brand-block {
    padding: 0 .35rem .35rem;
}

.agency-kicker {
    margin-top: .35rem;
    color: var(--tj-muted);
    font-size: .78rem;
    font-weight: 590;
    letter-spacing: -.01em;
}

.agency-main {
    padding: 2rem 1.75rem 3.5rem;
}

.agency-page {
    max-width: 1100px;
}

.agency-page h1 {
    font-size: clamp(1.7rem, 3vw, 2.15rem);
    margin-bottom: .45rem;
}

.agency-app .page-kicker {
    color: #0f9d94;
    font-weight: 650;
}

.agency-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.6rem;
}

.adash-identity {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    min-width: 0;
}

.adash-identity .profile-photo {
    margin-top: .15rem;
}

.adash-identity h1 {
    margin-bottom: .3rem;
}

.adash-next {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 1.2rem 1.3rem;
    border-radius: 22px;
    margin-bottom: 1.25rem;
    background:
        linear-gradient(165deg, rgba(18, 185, 129, .2), rgba(255,255,255,.78) 55%);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .06);
}

.adash-next span {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #0f9f70;
    margin-bottom: .25rem;
}

.adash-next strong {
    display: block;
    font-size: 1.25rem;
    letter-spacing: -.03em;
}

.adash-next em {
    display: block;
    margin-top: .3rem;
    font-style: normal;
    color: var(--tj-muted);
    font-weight: 500;
}

.adash-next:hover {
    outline: 1.5px solid rgba(18, 185, 129, .32);
    box-shadow: 0 16px 36px rgba(15, 23, 42, .1);
}

.adash-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .7rem;
    margin-bottom: 1.1rem;
}

.adash-stat {
    display: block;
    padding: .95rem 1.05rem;
    border-radius: 18px;
    text-decoration: none;
    color: inherit;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 10px 32px rgba(15, 23, 42, .06);
}

a.adash-stat:hover {
    outline: 1.5px solid rgba(18, 185, 129, .28);
    box-shadow: 0 16px 36px rgba(15, 23, 42, .1);
}

.adash-stat-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 10px;
    margin-bottom: .45rem;
    background: rgba(18, 185, 129, .12);
    color: #0f9f70;
    line-height: 0;
    overflow: hidden;
}

.adash-stat-ico svg {
    display: block;
    width: 1.05rem;
    height: 1.05rem;
    flex-shrink: 0;
}

.adash-stat > span:not(.adash-stat-ico) {
    display: block;
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.adash-stat strong {
    display: block;
    font-size: 1.7rem;
    font-weight: 780;
    letter-spacing: -.04em;
    line-height: 1.1;
    margin-top: .15rem;
}

.adash-stat.is-hot {
    background: linear-gradient(165deg, rgba(232, 93, 4, .16), rgba(255,255,255,.78) 58%);
}

.adash-stat.is-hot .adash-stat-ico {
    background: rgba(232, 93, 4, .14);
    color: #c2410c;
}

.adash-stat.is-hot strong {
    color: #c2410c;
}

.adash-stat.is-won {
    background: linear-gradient(165deg, rgba(16, 185, 129, .16), rgba(255,255,255,.78) 55%);
}

.adash-month {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr;
    gap: .7rem;
    margin-bottom: 1.6rem;
}

.adash-month > div {
    padding: 1rem 1.15rem;
    border-radius: 18px;
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.8);
}

.adash-month span {
    display: block;
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.adash-month strong {
    display: block;
    font-size: 1.35rem;
    font-weight: 760;
    letter-spacing: -.03em;
    margin: .2rem 0 .15rem;
}

.adash-month em {
    display: block;
    font-style: normal;
    font-size: .82rem;
    color: var(--tj-muted);
}

.adash-meter {
    height: .45rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, .08);
    overflow: hidden;
    margin: .45rem 0 .35rem;
}

.adash-meter b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #12b981, #0f9f70);
}

.adash-section {
    margin-bottom: 1.6rem;
}

.adash-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: .85rem;
}

.adash-section-head h2 {
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: -.03em;
    margin-bottom: .15rem;
}

.adash-section-head p {
    margin: 0;
    color: var(--tj-muted);
    font-size: .92rem;
}

.adash-section-head a {
    font-weight: 650;
    white-space: nowrap;
}

.adash-feed {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .8rem;
    padding: .75rem 0;
    border-bottom: .5px solid rgba(60, 60, 67, .1);
    color: inherit;
    text-decoration: none;
}

.adash-panel {
    height: 100%;
    padding: 1.15rem 1.25rem;
    border-radius: 22px;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 10px 32px rgba(15, 23, 42, .06);
    overflow: hidden;
}

.adash-feed:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.adash-feed strong {
    display: block;
    font-weight: 650;
    letter-spacing: -.02em;
}

.adash-feed span {
    display: block;
    color: var(--tj-muted);
    font-size: .86rem;
    margin-top: .1rem;
}

.adash-feed em {
    font-style: normal;
    font-weight: 750;
    color: var(--tj-teal-dark);
    white-space: nowrap;
}

a.adash-feed:hover strong {
    color: #0f9f70;
}

.adash-empty {
    padding: 1.7rem 1.4rem 1.5rem;
    border-radius: 24px;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    text-align: center;
}

.adash-empty h2 {
    font-size: 1.45rem;
    letter-spacing: -.03em;
}

.adash-empty p {
    color: var(--tj-muted);
    max-width: 34rem;
    margin: .4rem auto 1.1rem;
}

.finance-hero {
    display: block;
    padding: 1.2rem 1.3rem;
    border-radius: 22px;
    margin-bottom: 1.25rem;
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .06);
}

.finance-hero.is-due {
    background: linear-gradient(165deg, rgba(232, 93, 4, .16), rgba(255,255,255,.78) 55%);
}

.finance-hero.is-clear {
    background: linear-gradient(165deg, rgba(18, 185, 129, .18), rgba(255,255,255,.78) 55%);
}

.finance-hero span {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    margin-bottom: .25rem;
}

.finance-hero.is-due span {
    color: #c2410c;
}

.finance-hero.is-clear span {
    color: #0f9f70;
}

.finance-hero strong {
    display: block;
    font-size: 2rem;
    letter-spacing: -.04em;
    font-variant-numeric: tabular-nums;
}

.finance-hero em {
    display: block;
    margin-top: .35rem;
    font-style: normal;
    color: var(--tj-muted);
    font-weight: 500;
}

.finance-stats {
    margin-bottom: 1.4rem;
}

.finance-invoice-meta {
    grid-template-columns: repeat(3, 1fr);
}

.adash-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    text-align: left;
    margin-top: 1.6rem;
}

.adash-steps b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 999px;
    background: rgba(18, 185, 129, .14);
    color: #0f9f70;
    font-size: .82rem;
    margin-bottom: .45rem;
}

.adash-steps strong {
    display: block;
    margin-bottom: .15rem;
}

.adash-steps span {
    display: block;
    color: var(--tj-muted);
    font-size: .88rem;
}

@media (max-width: 900px) {
    .adash-stats,
    .adash-month,
    .adash-steps {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 560px) {
    .adash-stats,
    .adash-month,
    .adash-steps {
        grid-template-columns: 1fr;
    }
}

.agency-panel-title {
    font-size: .78rem;
    font-weight: 650;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tj-muted);
    margin-bottom: .85rem;
}

.sidebar-nav {
    flex-direction: column;
    flex: 1;
    gap: .25rem;
}

.sidebar-nav .nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.agency-logout {
    padding: 0 .15rem;
}

.agency-logout .btn {
    width: 100%;
    padding: .45rem .9rem;
}

.agency-app .btn-teal,
.agency-app .btn-primary {
    box-shadow: 0 8px 24px rgba(29, 184, 174, .26);
}

.agency-app .alert {
    border: 0;
    border-radius: 16px;
    padding: .9rem 1.05rem;
}

.agency-app .surface-card,
.agency-app .stat-card,
.agency-app .req-card {
    background: rgba(255,255,255,.62);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.8);
    border-radius: 22px;
    box-shadow: 0 10px 32px rgba(15, 23, 42, .06);
}

.agency-badge {
    background: var(--tj-teal);
    color: #fff;
    border-radius: 999px;
    font-size: .72rem;
    min-width: 1.4rem;
    height: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 .35rem;
    font-weight: 700;
}

.agency-badge.is-money {
    min-width: 0;
    padding: 0 .45rem;
    font-variant-numeric: tabular-nums;
}

.stat-label {
    color: var(--tj-muted);
    font-size: .78rem;
    font-weight: 590;
}

.stat-value {
    font-size: 1.85rem;
    font-weight: 700;
    letter-spacing: -.04em;
    line-height: 1.15;
    margin-top: .35rem;
}

.stat-value-sm {
    font-size: 1.25rem;
}

.stat-card-link {
    display: block;
    color: inherit;
}

.stat-card-link:hover {
    box-shadow: 0 14px 34px rgba(18, 149, 141, 0.14);
    outline: 1.5px solid rgba(18, 185, 129, .28);
}

.stat-card-quiet {
    padding: 1rem 1.2rem;
}

.agency-list-item {
    padding: .7rem 0;
    border-bottom: .5px solid rgba(60, 60, 67, .1);
    color: inherit;
    text-decoration: none;
    font-weight: 550;
}

.agency-list-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.agency-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.agency-tab {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem .9rem;
    border-radius: 999px;
    background: rgba(255,255,255,.55);
    border: .5px solid rgba(255,255,255,.8);
    color: var(--tj-ink);
    text-decoration: none;
    font-weight: 600;
    font-size: .88rem;
}

.agency-tab span {
    color: var(--tj-muted);
    font-weight: 590;
}

.agency-tab.active {
    background: var(--tj-teal);
    border-color: var(--tj-teal);
    color: #fff;
}

.agency-tab.active span {
    color: rgba(255,255,255,.82);
}

.req-card {
    display: block;
    border-radius: 22px;
    padding: 1.2rem 1.35rem;
    text-decoration: none;
    color: inherit;
    height: 100%;
}

.req-card-title {
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -.03em;
    margin-top: .35rem;
}

.req-card:hover {
    box-shadow: 0 16px 36px rgba(18, 149, 141, 0.14);
    outline: 1.5px solid rgba(18, 185, 129, .28);
}

.text-teal {
    color: var(--tj-teal-dark);
}

.agency-app .respond-banner {
    border-radius: 16px;
    border: .5px solid #ead0a8;
}

.dest-browse summary,
details summary {
    cursor: pointer;
    font-weight: 600;
}

.dest-suggest-add {
    color: var(--tj-teal-dark);
    font-weight: 600;
}

.has-app-tabs {
    padding-bottom: calc(4.6rem + env(safe-area-inset-bottom));
}

@media (min-width: 992px) {
    .has-app-tabs {
        padding-bottom: 0;
    }
}

.app-tabs {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    grid-template-columns: repeat(4, 1fr);
    gap: .15rem;
    padding: .35rem .4rem calc(.35rem + env(safe-area-inset-bottom));
    background: rgba(255,255,255,.82);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border-top: .5px solid rgba(60, 60, 67, .1);
    box-shadow: 0 -10px 28px rgba(28, 28, 30, .06);
}

.app-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .18rem;
    min-height: 44px;
    padding: .35rem .2rem;
    border-radius: 14px;
    color: #8e8e93;
    text-decoration: none;
    font-size: .68rem;
    font-weight: 650;
    letter-spacing: -.02em;
}

.app-tab svg {
    width: 1.35rem;
    height: 1.35rem;
}

.app-tab.is-on {
    color: var(--tj-indigo);
    background: rgba(var(--tj-indigo-rgb), .1);
}

.mode-putujem .app-tab.is-on {
    color: #0f9f70;
    background: rgba(18, 185, 129, .12);
}

@media (max-width: 991px) {
    .app-tabs {
        display: grid;
    }
    .site-header-actions .btn,
    .site-header-actions .header-logout {
        display: none;
    }
    .market-switch {
        display: none;
    }
    .site-menu {
        display: block;
    }
    .mode-switch {
        display: none;
    }
    .putujem-shortcuts {
        display: none;
    }
    .putujem-kicker {
        display: none;
    }
    .site-footer-brand {
        display: none;
    }
    .site-footer .container {
        padding-top: 1.1rem !important;
        padding-bottom: 1.1rem !important;
        flex-direction: row;
        flex-wrap: wrap;
        gap: .75rem 1.1rem;
        font-size: .82rem;
    }
}

@view-transition {
    navigation: auto;
}

@media (prefers-reduced-motion: reduce) {
    @view-transition {
        navigation: none;
    }
}

@media (max-width: 991px) {
    .agency-app .agency-shell {
        grid-template-columns: 1fr;
    }
    .agency-app .agency-sidebar {
        position: sticky;
        top: 0;
        z-index: 30;
        height: auto;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: .65rem;
        padding: .85rem 1rem;
        border-right: 0;
        border-bottom: .5px solid rgba(60, 60, 67, .1);
    }
    .agency-app .agency-brand-block {
        padding: 0;
        min-width: 0;
    }
    .agency-app .agency-kicker {
        display: none;
    }
    .agency-app .sidebar-nav {
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
        align-items: center;
        flex: 1 1 100%;
        order: 3;
        padding-bottom: .15rem;
    }
    .agency-app .sidebar-nav .nav-link {
        white-space: nowrap;
        padding: .45rem .75rem;
    }
    .agency-app .agency-logout {
        margin-left: auto;
        padding: 0;
    }
    .agency-app .agency-logout .btn {
        width: auto;
        padding: .35rem .8rem;
    }
    .agency-app .agency-main {
        padding: 1.4rem 1rem 3rem;
    }
    .how-track {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767px) {
    .search-submit { width: 100%; }
    .hero-stage {
        min-height: auto;
        padding: 6.8rem 0 4.2rem;
        align-items: center;
    }
    .hero-stage h1 { max-width: none; }
    .how-track {
        grid-template-columns: 1fr;
    }
    .story-card { min-height: 220px; }
    .home-sheet { border-radius: 22px 22px 0 0; }
    .planner { padding: 2.4rem 0 3.6rem; }
    .home-panel { padding: 3.2rem 0 2.4rem; }
    .home-panel + .home-panel { padding-top: 1.1rem; }
    .home-panel:last-child { padding-bottom: 3.8rem; }
    .home-panel-head { margin-bottom: 1.5rem; }
    .onboard-dots { grid-template-columns: repeat(2, 1fr); }
}

.onboard-page {
    background: var(--tj-bg);
    color: var(--tj-ink);
}

.onboard-wrap {
    position: relative;
    padding: 2.4rem 0 4rem;
    overflow: hidden;
}

.onboard-wrap::before,
.onboard-wrap::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(40px);
    pointer-events: none;
}

.onboard-wrap::before {
    width: 420px;
    height: 420px;
    left: -80px;
    top: -60px;
    background: rgba(48, 213, 200, .28);
}

.onboard-wrap::after {
    width: 480px;
    height: 480px;
    right: -120px;
    top: 120px;
    background: rgba(90, 170, 255, .22);
}

.onboard-shell {
    position: relative;
    z-index: 1;
    max-width: 760px;
}

.onboard-kicker {
    color: #0f9d94;
    font-size: .82rem;
    font-weight: 650;
    margin-bottom: .4rem;
}

.onboard-shell h1 {
    font-size: clamp(1.8rem, 4vw, 2.4rem);
    margin-bottom: .5rem;
}

.onboard-intro {
    color: #636366;
    max-width: 40rem;
}

.onboard-dots {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    list-style: none;
    padding: 0;
    gap: .6rem;
    margin: 1.4rem 0 1.2rem;
}

.onboard-dots li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 590;
    color: #8e8e93;
    text-align: center;
}

.onboard-dots .step-dot {
    border: 0;
}

.onboard-card {
    background: rgba(255,255,255,.5);
    backdrop-filter: saturate(200%) blur(32px);
    -webkit-backdrop-filter: saturate(200%) blur(32px);
    border: .5px solid rgba(255,255,255,.72);
    border-radius: 28px;
    padding: 1.45rem 1.4rem 1.3rem;
    box-shadow: 0 18px 50px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255,255,255,.8);
}

.onboard-card h2 {
    font-size: 1.25rem;
    margin-bottom: .35rem;
}

.onboard-help {
    color: #636366;
    font-size: .95rem;
    margin-bottom: 1.15rem;
}

.onboard-actions {
    display: flex;
    justify-content: space-between;
    gap: .7rem;
    margin-top: 1.1rem;
}

.onboard-page .btn-teal,
.onboard-page .btn-primary,
.onboard-page .btn-outline-teal {
    border-radius: 999px;
    min-width: 7.5rem;
}

.onboard-dest {
    background: rgba(255,255,255,.35);
    border-radius: 20px;
    padding: 1rem;
    border: .5px solid rgba(255,255,255,.55);
}

.onboard-dest .dest-browse {
    max-height: 280px;
    overflow: auto;
}

.mode-switch {
    --mode-pad: 6px;
    position: relative;
    margin: 0 auto 2.2rem;
    max-width: 560px;
}

.mode-switch::before {
    content: "";
    position: absolute;
    inset: 8px 18%;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(var(--tj-indigo-rgb), .38), transparent 70%);
    filter: blur(18px);
    z-index: 0;
    pointer-events: none;
    transition: background .35s ease;
}

.is-putujem.mode-switch::before {
    background: radial-gradient(circle, rgba(18, 185, 129, .4), transparent 70%);
}

.mode-track {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: var(--mode-pad);
    border-radius: 28px;
    background: rgba(255,255,255,.4);
    backdrop-filter: saturate(180%) blur(28px);
    -webkit-backdrop-filter: saturate(180%) blur(28px);
    border: .5px solid rgba(255,255,255,.78);
    box-shadow:
        0 18px 44px rgba(15, 23, 42, .1),
        inset 0 1px 0 rgba(255,255,255,.92);
}

.mode-slider {
    position: absolute;
    top: var(--mode-pad);
    left: var(--mode-pad);
    width: calc((100% - var(--mode-pad) * 2) / 2);
    height: calc(100% - var(--mode-pad) * 2);
    border-radius: 22px;
    background: var(--tj-indigo-grad);
    box-shadow:
        0 12px 28px rgba(var(--tj-indigo-rgb), .38),
        inset 0 1px 0 rgba(255,255,255,.35);
    transition: transform .42s cubic-bezier(.22, 1, .36, 1), background .3s ease, box-shadow .3s ease;
    pointer-events: none;
}

.mode-slider::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(180deg, rgba(255,255,255,.32), transparent 48%);
    pointer-events: none;
}

.is-putujem .mode-slider {
    transform: translateX(100%);
    background: linear-gradient(165deg, #4adeb0 0%, #12b981 58%, #0f9f70 100%);
    box-shadow:
        0 12px 28px rgba(18, 185, 129, .38),
        inset 0 1px 0 rgba(255,255,255,.35);
}

.mode-side {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .8rem;
    min-height: 84px;
    padding: .85rem 1rem;
    text-decoration: none;
    color: #8e8e93;
    border-radius: 22px;
    text-align: left;
}

.mode-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .18rem;
    min-width: 0;
    text-align: left;
}

.mode-side strong,
.mode-side small {
    text-align: left;
    width: 100%;
}

.mode-side strong {
    color: #1c1c1e;
    font-size: 1rem;
    letter-spacing: -.03em;
    line-height: 1.1;
}

.mode-side small {
    color: #8e8e93;
    font-size: .72rem;
    line-height: 1.3;
}

.mode-side.active {
    color: #fff;
}

.mode-side.active strong,
.mode-side.active small {
    color: #fff;
}

.mode-side.active small {
    color: rgba(255,255,255,.82);
}

.mode-ico {
    flex-shrink: 0;
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.62);
    color: var(--tj-indigo);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

.mode-side:last-child .mode-ico {
    color: #12b981;
}

.mode-side.active .mode-ico {
    background: rgba(255,255,255,.2);
    color: #fff;
    box-shadow: none;
}

.mode-ico svg {
    width: 1.2rem;
    height: 1.2rem;
}

.mode-knob {
    display: none;
}

.planner {
    position: relative;
    padding: 3.4rem 0 4.8rem;
    overflow: hidden;
}

.planner::before,
.planner::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(50px);
    pointer-events: none;
}

.planner::before {
    width: 380px;
    height: 380px;
    left: -80px;
    top: -80px;
    background: radial-gradient(circle at 35% 35%, rgba(var(--tj-indigo-rgb), .34), rgba(var(--tj-indigo-rgb), .08) 52%, transparent 72%);
}

.planner::after {
    width: 420px;
    height: 420px;
    right: -100px;
    top: 40px;
    background: rgba(18, 185, 129, .14);
}

.planner-inner {
    position: relative;
    z-index: 1;
    max-width: calc(760px + 1.5rem);
    text-align: center;
}

.planner .hero-badge {
    color: var(--tj-indigo);
    background: rgba(var(--tj-indigo-rgb), .1);
    border-color: rgba(var(--tj-indigo-rgb), .18);
}

.planner h1 {
    font-size: clamp(2rem, 5.5vw, 5.2rem);
    line-height: 1.05;
    max-width: 12ch;
    margin: 0 auto;
    padding: 1.5rem 0 1.75rem;
    color: #1c1c1e;
}

@media (min-width: 992px) {
    .planner-inner {
        max-width: 56rem;
    }

    .planner h1 {
        font-size: 5.2rem;
        max-width: none;
    }

    .planner-card {
        max-width: 760px;
        margin-left: auto;
        margin-right: auto;
    }
}

.planner h1 span { color: var(--tj-indigo); }

.planner h1 .hero-title-line {
    display: block;
    color: inherit;
}

.planner .hero-sub {
    color: #636366;
    max-width: 32rem;
    margin: 0 auto 2rem;
}

.planner-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    max-width: 360px;
    margin: 0 auto 1rem;
    padding: 4px;
    border-radius: 999px;
    background: rgba(255,255,255,.45);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.78);
}

.planner-tab {
    border: 0;
    background: transparent;
    border-radius: 999px;
    padding: .55rem .9rem;
    font-weight: 650;
    letter-spacing: -.02em;
    color: #8e8e93;
}

.planner-tab.is-on {
    background: #fff;
    color: var(--tj-indigo);
    box-shadow: 0 6px 16px rgba(15, 23, 42, .08);
}

.planner-pane {
    display: none;
}

.planner-pane.is-on {
    display: block;
}

.planner-sentence {
    display: block;
    padding: 1.05rem 1.15rem .2rem;
    text-align: left;
    margin: 0;
}

.planner-sentence small {
    display: block;
    font-size: .68rem;
    color: #8e8e93;
    font-weight: 590;
    margin-bottom: .35rem;
}

.planner-sentence textarea {
    width: 100%;
    border: 0;
    background: transparent;
    resize: none;
    font-weight: 650;
    font-size: 1.05rem;
    letter-spacing: -.02em;
    color: #1c1c1e;
    outline: none;
    min-height: 5.2rem;
    line-height: 1.4;
}

.planner-card {
    position: relative;
    z-index: 3;
    background: rgba(255,255,255,.62);
    backdrop-filter: saturate(180%) blur(28px);
    -webkit-backdrop-filter: saturate(180%) blur(28px);
    border: .5px solid rgba(255,255,255,.8);
    border-radius: 28px;
    overflow: visible;
    text-align: left;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .08);
    max-width: 760px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.planner-row {
    display: flex;
    gap: .85rem;
    align-items: center;
    padding: .9rem 1.1rem;
    border-bottom: .5px solid rgba(60, 60, 67, .1);
    margin: 0;
}

.planner-row small {
    display: block;
    font-size: .68rem;
    color: #8e8e93;
    font-weight: 590;
}

.planner-row select,
.planner-row input {
    border: 0;
    background: transparent;
    width: 100%;
    font-weight: 650;
    color: #1c1c1e;
    outline: none;
}

.planner-ico {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 1.35rem;
    height: 1.35rem;
    color: #8e8e93;
}

.planner-ico svg {
    width: 1.28rem;
    height: 1.28rem;
    display: block;
}

.planner-dest {
    position: relative;
    z-index: 3;
}

.planner-dest-field {
    flex: 1;
    min-width: 0;
}

.planner-suggest {
    position: absolute;
    left: .55rem;
    right: .55rem;
    top: calc(100% - .15rem);
    z-index: 8;
    margin: 0;
    padding: .35rem;
    list-style: none;
    background: rgba(255,255,255,.96);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.9);
    border-radius: 18px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .14);
    max-height: 16rem;
    overflow: auto;
}

.planner-suggest li[role="option"] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    padding: .7rem .85rem;
    border-radius: 12px;
    cursor: pointer;
}

.planner-suggest li[role="option"] strong {
    font-size: .95rem;
    font-weight: 700;
    letter-spacing: -.02em;
}

.planner-suggest li[role="option"] small {
    color: #8e8e93;
    font-size: .78rem;
    font-weight: 590;
}

.planner-suggest li.is-on,
.planner-suggest li[role="option"]:hover {
    background: rgba(var(--tj-indigo-rgb), .1);
}

.planner-suggest-empty {
    padding: .85rem;
    color: #8e8e93;
    font-size: .9rem;
}

.planner-date {
    position: relative;
    z-index: 2;
}

.planner-date.is-open {
    z-index: 12;
}

.planner-date [data-date-display] {
    cursor: pointer;
}

.planner-cal {
    position: absolute;
    left: .55rem;
    right: auto;
    width: min(18.25rem, calc(100% - 1.1rem));
    top: calc(100% - .15rem);
    z-index: 8;
    padding: .55rem .6rem .6rem;
    background: rgba(255,255,255,.96);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255,255,255,.9);
    border-radius: 16px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .14);
}

.planner-cal.is-end {
    left: auto;
    right: .55rem;
}

.planner-cal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
    margin-bottom: .4rem;
}

.planner-cal-head strong {
    flex: 1;
    text-align: center;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: -.03em;
    text-transform: capitalize;
}

.planner-cal-nav {
    width: 1.7rem;
    height: 1.7rem;
    border: 0;
    border-radius: 999px;
    background: rgba(var(--tj-indigo-rgb), .1);
    color: var(--tj-indigo);
    font-size: 1.15rem;
    line-height: 1;
    font-weight: 700;
}

.planner-cal-week,
.planner-cal-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: .08rem;
    text-align: center;
}

.planner-cal-week {
    margin-bottom: .15rem;
}

.planner-cal-week span {
    font-size: .6rem;
    font-weight: 650;
    color: #8e8e93;
    padding: .08rem 0;
}

.planner-cal-days button {
    width: 100%;
    aspect-ratio: 1;
    max-height: 1.85rem;
    border: 0;
    background: transparent;
    border-radius: 8px;
    font-weight: 650;
    color: #1c1c1e;
    font-size: .78rem;
    line-height: 1;
}

.planner-cal-days button.is-today {
    box-shadow: inset 0 0 0 1.5px rgba(var(--tj-indigo-rgb), .45);
}

.planner-cal-days button.is-in {
    background: rgba(var(--tj-indigo-rgb), .12);
    border-radius: 0;
}

.planner-cal-days button.is-on,
.planner-cal-days button.is-on:hover {
    background: var(--tj-indigo-grad);
    color: #fff;
    box-shadow: none;
}

.planner-cal-days button.is-on.is-start {
    border-radius: 8px 0 0 8px;
}

.planner-cal-days button.is-on.is-end {
    border-radius: 0 8px 8px 0;
}

.planner-cal-days button.is-on.is-start.is-end,
.planner-cal-days button.is-on:not(.is-start):not(.is-end) {
    border-radius: 8px;
}

.planner-cal-days button:hover:not(:disabled):not(.is-on) {
    background: rgba(var(--tj-indigo-rgb), .1);
}

.planner-cal-days button:disabled {
    color: #c7c7cc;
}

.planner-cal-foot {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    margin-top: .4rem;
}

.planner-cal-foot button {
    border: 0;
    background: transparent;
    color: var(--tj-indigo);
    font-weight: 650;
    font-size: .78rem;
    padding: .15rem 0;
}

.planner-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 0;
}

.planner-split label {
    display: flex;
    gap: .85rem;
    align-items: center;
    padding: .9rem 1.1rem;
    margin: 0;
}

.planner-split label:first-child {
    border-right: .5px solid rgba(60, 60, 67, .1);
}

.planner-ages {
    display: none;
    grid-template-columns: repeat(auto-fill, minmax(7.2rem, 1fr));
    border-bottom: .5px solid rgba(60, 60, 67, .1);
}

.planner-ages.is-on {
    display: grid;
}

.planner-ages label {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    padding: .75rem 1.1rem;
    margin: 0;
    border-right: .5px solid rgba(60, 60, 67, .1);
}

.planner-ages small {
    display: block;
    font-size: .68rem;
    color: #8e8e93;
    font-weight: 590;
}

.planner-ages input {
    border: 0;
    background: transparent;
    width: 100%;
    font-weight: 650;
    color: #1c1c1e;
    outline: none;
}

.planner-errors {
    margin: .65rem .65rem 0;
    max-width: none;
    min-width: 0;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}

.planner-cta,
.btn-tipujem {
    --bs-btn-bg: var(--tj-indigo);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: var(--tj-indigo-dark);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    background-image: var(--tj-indigo-grad);
    border-radius: 999px;
    margin: 1rem;
    min-height: 3.2rem;
    width: calc(100% - 2rem);
    box-shadow: 0 10px 28px rgba(var(--tj-indigo-rgb), .32);
}

.planner-cta:hover,
.btn-tipujem:hover {
    background-image: linear-gradient(165deg, #05bed4 0%, #0499ad 100%);
}

.planner.is-inquiry {
    padding: 2.2rem 0 4.2rem;
    overflow: visible;
}

.planner.is-inquiry .planner-inner {
    max-width: calc(760px + 1.5rem);
}

.planner.is-inquiry h1 {
    font-size: clamp(1.7rem, 3.4vw, 2.35rem);
    max-width: none;
    margin: 0 auto;
    padding: .35rem 0 .4rem;
    line-height: 1.15;
}

.planner.is-inquiry .hero-sub {
    margin: 0 auto 1.15rem;
}

.planner.is-inquiry .notice {
    text-align: left;
}

.planner.is-inquiry .planner-card {
    max-width: 760px;
}

.planner-row > span:not(.planner-ico),
.planner-split label > span:not(.planner-ico) {
    flex: 1;
    min-width: 0;
}

.planner-section {
    margin: 0;
    padding: .9rem 1.1rem .15rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8e8e93;
}

.planner-check {
    gap: .7rem;
}

.planner-row input[type="checkbox"] {
    width: 1.05rem;
    height: 1.05rem;
    flex: none;
    accent-color: var(--tj-indigo);
}

.planner-shortcuts {
    position: relative;
    z-index: 1;
    margin: 1.15rem auto 0;
    max-width: 40rem;
    text-align: center;
}

.planner-shortcuts-kicker {
    margin: 0 0 .65rem;
    color: #636366;
    font-size: .78rem;
    font-weight: 600;
}

.planner-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .45rem;
}

.planner-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: .48rem .95rem;
    border-radius: 999px;
    border: .5px solid rgba(255, 255, 255, .88);
    background: rgba(255, 255, 255, .58);
    backdrop-filter: saturate(180%) blur(18px);
    -webkit-backdrop-filter: saturate(180%) blur(18px);
    color: #3a3a3c;
    font-size: .82rem;
    font-weight: 550;
    line-height: 1.3;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .05);
}

.planner-chip:hover {
    background: #fff;
    color: var(--tj-indigo-dark);
}

.planner .hero-pills span {
    color: #3a3a3c;
    background: rgba(255,255,255,.55);
    border-color: rgba(255,255,255,.8);
}

.btn-putujem {
    --bs-btn-bg: #12b981;
    --bs-btn-border-color: #12b981;
    --bs-btn-hover-bg: #0f9f70;
    --bs-btn-hover-border-color: #0f9f70;
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    border-radius: 999px;
    font-weight: 650;
    box-shadow: 0 10px 28px rgba(18, 185, 129, .28);
}

.putujem-page {
    background:
        radial-gradient(600px 320px at 8% -10%, rgba(18, 185, 129, .18), transparent 50%),
        radial-gradient(520px 280px at 100% 0%, rgba(var(--tj-indigo-rgb), .1), transparent 46%),
        var(--tj-bg);
}

.putujem-wrap { padding: 3.4rem 0 4rem; }

@media (max-width: 991px) {
    .putujem-wrap { padding: 1.5rem 0 3rem; }
}

.putujem-shell { max-width: 680px; }

.putujem-kicker {
    color: #12b981;
    font-weight: 650;
    font-size: .82rem;
}

.putujem-shell h1 {
    font-size: clamp(1.45rem, 4vw, 2.1rem);
    margin: 0;
    flex: 1;
    min-width: 0;
}

.putujem-head {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    margin-bottom: .35rem;
}

.feed-filter {
    position: relative;
    flex: 0 0 auto;
    margin-top: .12rem;
}

.feed-filter summary {
    list-style: none;
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #14786e;
    background: #fff;
    border: .5px solid rgba(18, 185, 129, .18);
    box-shadow: 0 8px 18px rgba(18, 185, 129, .08);
}

.feed-filter summary::-webkit-details-marker,
.feed-filter summary::marker {
    display: none;
    content: "";
}

.feed-filter summary svg {
    width: 1.2rem;
    height: 1.2rem;
}

.feed-filter.is-filtered summary,
.feed-filter[open] summary {
    background: #12b981;
    color: #fff;
    border-color: transparent;
}

.feed-filter .feed-chips {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 12;
    display: grid;
    gap: .3rem;
    min-width: 13.5rem;
    margin: 0;
    padding: .45rem;
    overflow: visible;
    background: rgba(255,255,255,.96);
    border-radius: 16px;
    border: .5px solid rgba(60, 60, 67, .08);
    box-shadow: 0 16px 36px rgba(28, 28, 30, .12);
}

.feed-filter .feed-chips a {
    width: 100%;
    text-align: left;
}

.putujem-meta,
.putujem-intro { color: #636366; }

.putujem-shortcuts {
    margin: 1.6rem 0 .5rem;
}

.putujem-shortcuts .planner-shortcuts-kicker {
    color: #3d8f86;
}

.putujem-shortcuts .planner-chip {
    background: #fff;
    border-color: rgba(18, 185, 129, .22);
    color: #14786e;
    box-shadow: 0 6px 16px rgba(18, 185, 129, .08);
}

.putujem-shortcuts .planner-chip:hover {
    background: #ecfdf7;
    color: #0f766e;
}

.putujem-im-here {
    margin: 0 0 1rem;
}

.putujem-im-here-btn {
    border: 0;
    background: transparent;
    color: #0f9d94;
    font-weight: 650;
    font-size: .9rem;
    padding: 0;
}

.putujem-place-form .putujem-dest {
    background: rgba(255,255,255,.78);
}

.feed-chips {
    display: flex;
    gap: .4rem;
    overflow-x: auto;
    padding-top: .55rem;
    padding-bottom: .4rem;
    margin-bottom: 1rem;
}

.feed-chips a {
    flex: 0 0 auto;
    text-decoration: none;
    color: #1c1c1e;
    background: rgba(255,255,255,.7);
    border-radius: 999px;
    padding: .38rem .8rem;
    font-size: .8rem;
    font-weight: 590;
}

.feed-chips a.active {
    background: #12b981;
    color: #fff;
}

.feed-card {
    background: rgba(255,255,255,.7);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-radius: 22px;
    padding: 1rem 1.1rem;
    margin-bottom: .75rem;
    border: .5px solid rgba(255,255,255,.8);
}

.feed-card-top {
    display: flex;
    justify-content: space-between;
    gap: .7rem;
    margin-bottom: .45rem;
}

.feed-tag {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tj-indigo);
}

.cat-important .feed-tag { color: #ff3b30; }
.cat-lost_found .feed-tag { color: #ff9500; }
.cat-traffic .feed-tag { color: #ff3b30; }
.cat-beaches .feed-tag { color: #007aff; }
.cat-question .feed-tag { color: #af52de; }

.feed-card time,
.feed-card-foot { color: #8e8e93; font-size: .78rem; }

.feed-card p { margin: 0 0 .5rem; font-weight: 510; }

.feed-card img {
    width: 100%;
    border-radius: 14px;
    margin-bottom: .6rem;
}

.feed-card-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.feed-confirm {
    border: 0;
    background: rgba(18, 185, 129, .12);
    color: #0f9f70;
    border-radius: 999px;
    padding: .25rem .7rem;
    font-size: .75rem;
    font-weight: 650;
}

.feed-confirm.is-on { background: #12b981; color: #fff; }

.feed-empty,
.feed-compose {
    background: rgba(255,255,255,.62);
    border-radius: 22px;
    padding: 1.2rem;
    margin-top: .5rem;
}

.feed-fab {
    display: block;
    text-align: center;
    margin-top: 1.2rem;
    padding: .9rem 1.2rem;
}

.putujem-plus {
    display: none;
}

@media (max-width: 991px) {
    .feed-fab {
        display: none;
    }
    .putujem-plus {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        right: 1rem;
        bottom: calc(5.15rem + env(safe-area-inset-bottom));
        z-index: 35;
        width: 3.5rem;
        height: 3.5rem;
        border-radius: 999px;
        background: #12b981;
        color: #fff;
        box-shadow: 0 12px 28px rgba(15, 159, 112, .38);
        text-decoration: none;
    }
    .putujem-plus svg {
        width: 1.45rem;
        height: 1.45rem;
    }
}

.putujem-checkin { margin-top: 1.2rem; position: relative; overflow: visible; }

.putujem-gps {
    margin: 0 0 .85rem;
    color: #12b981;
    font-weight: 650;
    font-size: .92rem;
}

.putujem-gps.is-found {
    color: #0f9d94;
}

.putujem-gps-retry {
    width: 100%;
    margin-top: .75rem;
    border: 0;
    background: transparent;
    color: #12b981;
    font-weight: 650;
}

.putujem-dest {
    background: rgba(242, 242, 247, .7);
    border-radius: 18px;
    margin: 0;
}

.putujem-dest .planner-suggest {
    left: .4rem;
    right: .4rem;
}

@media (max-width: 767px) {
    .mode-side {
        min-height: 64px;
        padding: .7rem .75rem;
        gap: .55rem;
    }
    .mode-side small { display: none; }
    .mode-side strong { font-size: .92rem; }
    .mode-ico {
        width: 2.1rem;
        height: 2.1rem;
        border-radius: 12px;
    }
    .planner-split { grid-template-columns: 1fr; }
    .planner-split label:first-child { border-right: 0; border-bottom: .5px solid rgba(60,60,67,.1); }
    .planner-ages { grid-template-columns: 1fr 1fr; }
    .planner-ages label { border-right: .5px solid rgba(60,60,67,.1); }
}

.guest-page {
    background: var(--tj-bg);
}

.guest-shell {
    max-width: calc(760px + 1.5rem);
}

.guest-shell:has(.register-pick) {
    max-width: calc(760px + 1.5rem);
}

.register-pick h1,
.guest-auth h1 {
    font-size: clamp(1.7rem, 3vw, 2.15rem);
    letter-spacing: -.03em;
    margin-bottom: .4rem;
}

.guest-auth h1 {
    margin-bottom: 1.15rem;
}

.register-pick-intro {
    color: var(--tj-muted);
    max-width: 32rem;
    margin-bottom: 1.4rem;
}

.register-picks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .9rem;
}

.register-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .45rem;
    min-height: 100%;
    padding: 1.3rem 1.25rem 1.2rem;
    text-decoration: none;
    color: inherit;
}

.guest-card,
.register-box {
    border-radius: 22px;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 10px 32px rgba(15, 23, 42, .06);
}

.guest-card {
    padding: 1.4rem 1.35rem 1.45rem;
}

.guest-shell:has(.guest-auth) {
    max-width: calc(760px + 1.5rem);
}

.register-box:hover {
    outline: 1.5px solid rgba(18, 185, 129, .32);
    box-shadow: 0 16px 36px rgba(15, 23, 42, .1);
}

.register-box-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 3rem;
    height: 3rem;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: .45rem;
    color: #0f9f70;
    background: rgba(18, 185, 129, .14);
}

.register-box.is-agency .register-box-ico {
    color: #0f9d94;
    background: rgba(29, 184, 174, .16);
}

.register-box-ico svg {
    width: 1.55rem;
    height: 1.55rem;
    flex: none;
}

.register-box strong {
    font-size: 1.2rem;
    font-weight: 750;
    letter-spacing: -.03em;
    line-height: 1.2;
}

.register-box > span:not(.register-box-ico) {
    color: var(--tj-muted);
    font-size: .95rem;
    font-weight: 500;
    line-height: 1.4;
    flex: 1;
}

.register-box em {
    margin-top: .55rem;
    font-style: normal;
    font-weight: 700;
    font-size: .92rem;
    color: #0f9f70;
}

.register-box:hover em {
    color: #0b7d58;
}

.register-pick-login {
    margin: 1.35rem 0 0;
}

.guest-card .guest-auth-links {
    display: flex;
    justify-content: space-between;
    gap: .8rem;
    margin-top: 1rem;
}

.guest-card .guest-auth-links a,
.register-pick-login a {
    font-weight: 600;
    color: var(--tj-muted);
    text-decoration: none;
}

.guest-card .guest-auth-links a:hover,
.register-pick-login a:hover {
    color: var(--tj-teal-dark);
}

@media (max-width: 700px) {
    .register-picks {
        grid-template-columns: 1fr;
    }
}

.admin-app {
    background:
        radial-gradient(620px 340px at 0% -8%, rgba(18, 185, 129, .16), transparent 52%),
        radial-gradient(520px 280px at 100% 0%, rgba(29, 184, 174, .1), transparent 46%),
        var(--tj-bg);
}

.admin-nav-label {
    margin: .85rem .15rem .2rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.admin-nav-label:first-child {
    margin-top: .15rem;
}

.admin-site-link {
    display: block;
    padding: .15rem .5rem .45rem;
    font-size: .86rem;
    font-weight: 600;
    color: var(--tj-muted);
    text-decoration: none;
}

.admin-site-link:hover {
    color: var(--tj-teal-dark);
}

.admin-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .85rem 1rem;
    margin-bottom: 1.1rem;
}

.admin-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.admin-chip {
    display: inline-flex;
    align-items: center;
    padding: .32rem .7rem;
    border-radius: 999px;
    background: rgba(255,255,255,.7);
    border: .5px solid rgba(60, 60, 67, .12);
    color: inherit;
    text-decoration: none;
    font-size: .82rem;
    font-weight: 600;
}

.admin-chip.is-on,
.admin-chip:hover {
    background: rgba(18, 185, 129, .14);
    border-color: rgba(18, 185, 129, .28);
    color: #0f9f70;
}

.admin-search {
    display: flex;
    gap: .45rem;
    min-width: min(100%, 280px);
}

.admin-search .form-control {
    border-radius: 12px;
}

.admin-table-wrap {
    overflow-x: auto;
    border-radius: 22px;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.85);
    box-shadow: 0 10px 32px rgba(15, 23, 42, .06);
    margin-bottom: 1rem;
}

.admin-table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
}

.admin-table th,
.admin-table td {
    padding: .85rem 1.1rem;
    border-bottom: .5px solid rgba(60, 60, 67, .08);
    vertical-align: middle;
}

.admin-table th {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tj-muted);
}

.admin-table tr:last-child td {
    border-bottom: 0;
}

.admin-table tr.is-unread td {
    font-weight: 650;
}

.admin-strong {
    font-weight: 650;
    color: inherit;
    text-decoration: none;
}

.admin-strong:hover {
    color: #0f9f70;
}

.admin-sub {
    color: var(--tj-muted);
    font-size: .82rem;
    margin-top: .12rem;
}

.admin-reject {
    display: flex;
    gap: .45rem;
    flex: 1;
    min-width: min(100%, 280px);
}

.admin-app .adash-stat strong.admin-stat-text {
    font-size: .95rem;
    font-weight: 650;
    letter-spacing: -.01em;
}

.admin-app .adash-stat > span.admin-stat-note {
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0;
    margin-top: .2rem;
}

@media (max-width: 991px) {
    .admin-app .admin-nav-label,
    .admin-app .admin-site-link {
        display: none;
    }
}

.accordion-button {
    font-family: var(--tj-font);
    font-weight: 650;
    letter-spacing: -.02em;
    background: transparent !important;
}

.accordion-button:not(.collapsed) {
    color: var(--tj-ink);
    box-shadow: none;
}

.page-kicker {
    color: var(--tj-muted);
    font-size: .82rem;
    font-weight: 590;
    margin-bottom: .25rem;
}

.agencies-page {
    background:
        radial-gradient(620px 340px at 8% -8%, rgba(18, 185, 129, .16), transparent 52%),
        radial-gradient(520px 280px at 100% 0%, rgba(29, 184, 174, .12), transparent 46%),
        var(--tj-bg);
    overflow-x: hidden;
}

.agencies-page .page-kicker {
    color: #0f9d94;
    font-weight: 650;
}

.pitch-page.has-motion [data-reveal] {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .75s cubic-bezier(.22, 1, .36, 1), transform .75s cubic-bezier(.22, 1, .36, 1);
}

.pitch-page.has-motion [data-reveal].is-in {
    opacity: 1;
    transform: none;
}

.agencies-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(8px);
    pointer-events: none;
    z-index: 0;
}

.agencies-orb-a {
    width: 280px;
    height: 280px;
    top: 2rem;
    left: -4rem;
    background: rgba(18, 185, 129, .22);
}

.agencies-orb-b {
    width: 340px;
    height: 340px;
    top: 8rem;
    right: -6rem;
    background: rgba(5, 190, 212, .16);
}

.agencies-hero {
    position: relative;
    padding: 3.2rem 0 2.2rem;
}

.agencies-shell {
    position: relative;
    z-index: 1;
    max-width: 1080px;
}

.agencies-hero-grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 2.4rem;
    align-items: center;
}

.agencies-hero-copy h1 {
    font-size: clamp(2.1rem, 4.6vw, 3.15rem);
    max-width: 12ch;
    margin: 0 0 .85rem;
    line-height: 1.06;
}

.agencies-hero-copy .agencies-lead {
    margin: 0 0 1.3rem;
}

.agencies-hero-copy .agencies-proof {
    margin: 0 0 1.4rem;
}

.agencies-hero-copy .agencies-actions {
    justify-content: flex-start;
}

.agencies-hero-stage {
    position: relative;
    min-height: 22rem;
}

.agencies-ticket {
    position: absolute;
    width: min(100%, 22rem);
    background: rgba(255,255,255,.78);
    backdrop-filter: saturate(180%) blur(18px);
    -webkit-backdrop-filter: saturate(180%) blur(18px);
    border: .5px solid rgba(255,255,255,.9);
    border-radius: 22px;
    padding: 1.05rem 1.15rem 1.1rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .1);
    animation: agencies-float 5.6s ease-in-out infinite;
}

.agencies-ticket span {
    display: block;
    color: #0f9d94;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: .35rem;
}

.agencies-ticket p {
    margin: 0;
    font-weight: 650;
    color: #1c1c1e;
    line-height: 1.35;
}

.agencies-ticket small {
    display: block;
    margin-top: .4rem;
    color: #636366;
    font-weight: 550;
}

.agencies-ticket.is-back {
    top: .2rem;
    left: 8%;
    transform: rotate(-7deg);
    opacity: .72;
    animation-delay: -.8s;
}

.agencies-ticket.is-mid {
    top: 4.4rem;
    right: 0;
    transform: rotate(5deg);
    opacity: .86;
    animation-delay: -2.2s;
}

.agencies-ticket.is-front {
    top: 9.4rem;
    left: 4%;
    transform: rotate(-2deg);
}

@keyframes agencies-float {
    0%, 100% { translate: 0 0; }
    50% { translate: 0 -9px; }
}

.agencies-lead {
    color: #636366;
    max-width: 38rem;
    margin: 0 auto 1.6rem;
    font-size: 1.05rem;
}

.agencies-proof {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    list-style: none;
    padding: 0;
    max-width: 720px;
}

.agencies-proof li {
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.82);
    border-radius: 18px;
    padding: .85rem .7rem .9rem;
}

.agencies-proof strong {
    display: block;
    font-size: 1.55rem;
    font-weight: 750;
    letter-spacing: -.04em;
    color: #0f9d94;
    line-height: 1.1;
}

.agencies-proof span {
    display: block;
    margin-top: .2rem;
    color: #636366;
    font-size: .82rem;
    font-weight: 550;
}

.agencies-cta-note {
    margin: .85rem 0 0;
    color: #8e8e93;
    font-size: .88rem;
    font-weight: 550;
}

.agencies-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .7rem;
}

.agencies-marquee {
    overflow: hidden;
    padding: .55rem 0 1.4rem;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.agencies-marquee-track {
    display: flex;
    gap: 10px;
    width: max-content;
    animation: agencies-marquee 32s linear infinite;
}

.agencies-marquee-chip {
    flex-shrink: 0;
    padding: .55rem 1.05rem;
    border-radius: 999px;
    background: rgba(255,255,255,.7);
    border: .5px solid rgba(255,255,255,.88);
    color: #14786e;
    font-weight: 650;
    font-size: .92rem;
}

@keyframes agencies-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.agencies-block {
    padding: 3.2rem 0 1.8rem;
}

.agencies-block-tint {
    background: linear-gradient(180deg, rgba(18, 185, 129, .06), transparent 70%);
}

.agencies-split {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 1rem;
    align-items: stretch;
    max-width: 860px;
    margin: 0 auto;
}

.agencies-split-col {
    border-radius: 24px;
    padding: 1.3rem 1.25rem 1.4rem;
}

.agencies-split-col small {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    margin-bottom: .85rem;
}

.agencies-split-col p {
    margin: 0 0 .85rem;
    font-weight: 550;
    line-height: 1.4;
}

.agencies-split-col p:last-child { margin-bottom: 0; }

.agencies-split-col.is-old {
    background: rgba(255,255,255,.42);
    border: .5px solid rgba(255,255,255,.7);
    color: #636366;
}

.agencies-split-col.is-old small { color: #8e8e93; }

.agencies-split-col.is-new {
    background: rgba(18, 185, 129, .1);
    border: .5px solid rgba(18, 185, 129, .18);
    color: #1c1c1e;
}

.agencies-split-col.is-new small { color: #0f9d94; }

.agencies-split-mark {
    display: grid;
    place-items: center;
    color: #0f9d94;
    font-size: 1.6rem;
    font-weight: 700;
}

.agencies-briefs {
    display: grid;
    gap: 14px;
    max-width: 760px;
    margin: 0 auto;
}

.agencies-brief {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1rem;
    background: rgba(255,255,255,.72);
    border: .5px solid rgba(255,255,255,.88);
    border-radius: 22px;
    padding: 1.15rem 1.25rem;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .05);
}

.agencies-brief-no {
    font-size: 1.35rem;
    font-weight: 750;
    letter-spacing: -.05em;
    color: #0f9d94;
    line-height: 1;
    padding-top: .15rem;
}

.agencies-brief p {
    margin: 0 0 .35rem;
    font-weight: 650;
    color: #1c1c1e;
}

.agencies-brief small {
    color: #0f9d94;
    font-weight: 600;
}

.agencies-bento {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 14px;
}

.agencies-bento-card {
    background: rgba(255,255,255,.62);
    border: .5px solid rgba(255,255,255,.82);
    border-radius: 22px;
    padding: 1.2rem 1.2rem 1.25rem;
}

.agencies-bento-ico {
    display: grid;
    place-items: center;
    width: 2.4rem;
    height: 2.4rem;
    margin-bottom: .75rem;
    border-radius: 12px;
    background: rgba(18, 185, 129, .12);
    color: #0f9d94;
}

.agencies-bento-ico svg {
    width: 1.25rem;
    height: 1.25rem;
}

.agencies-bento-card h3 {
    font-size: 1.12rem;
    margin-bottom: .4rem;
}

.agencies-bento-card p {
    margin: 0;
    color: #636366;
    font-weight: 500;
}

.agencies-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    position: relative;
}

.agencies-step {
    background: rgba(255,255,255,.7);
    border: .5px solid rgba(255,255,255,.86);
    border-radius: 22px;
    padding: 1.2rem 1.1rem 1.25rem;
}

.agencies-step span {
    display: block;
    font-size: 2.2rem;
    font-weight: 750;
    letter-spacing: -.06em;
    color: #0f9d94;
    line-height: 1;
    margin-bottom: .55rem;
}

.agencies-step h3 {
    font-size: 1.08rem;
    margin-bottom: .35rem;
}

.agencies-step p {
    margin: 0;
    color: #636366;
    font-weight: 500;
}

.agencies-fee-band,
.agencies-close {
    margin-top: 1.2rem;
    padding: 4.4rem 0;
    text-align: center;
    color: #fff;
    background:
        radial-gradient(520px 240px at 12% 0%, rgba(255,255,255,.16), transparent 55%),
        linear-gradient(165deg, #12b981 0%, #0f9d94 48%, #0b7f86 100%);
}

.agencies-fee-kicker {
    margin: 0;
    color: rgba(255,255,255,.78);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: .78rem;
}

.agencies-fee-num {
    margin: .1rem 0 .2rem;
    font-size: clamp(4.4rem, 12vw, 7.2rem);
    font-weight: 750;
    letter-spacing: -.07em;
    line-height: .9;
}

.agencies-fee-body {
    max-width: 34rem;
    margin: .4rem auto .75rem;
    color: rgba(255,255,255,.86);
}

.agencies-fee-example {
    margin: 0;
    font-weight: 650;
}

.agencies-close {
    background:
        radial-gradient(420px 200px at 88% 10%, rgba(255,255,255,.16), transparent 50%),
        linear-gradient(165deg, #0f9d94 0%, #0b7f86 100%);
    padding-bottom: 5rem;
}

.agencies-close h2 {
    color: #fff;
}

.agencies-close .agencies-lead {
    color: rgba(255,255,255,.86);
}

.agencies-close .agencies-cta-note,
.agencies-close a:not(.btn) {
    color: rgba(255,255,255,.86);
    font-weight: 650;
}

.agencies-page .agencies-close .btn-outline-teal,
.agencies-page .agencies-close .btn-outline-primary {
    --bs-btn-color: #0b7f86;
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #fff;
    --bs-btn-hover-bg: #ecfdf7;
    --bs-btn-hover-border-color: #fff;
    --bs-btn-hover-color: #0b7f86;
    color: #0b7f86;
    background: #fff;
    border-color: #fff;
}

.agencies-faq-shell {
    max-width: 750px;
}

.agencies-faq details {
    background: rgba(255,255,255,.58);
    border: .5px solid rgba(255,255,255,.78);
    border-radius: 16px;
    padding: .95rem 1.1rem;
    margin-bottom: 10px;
}

.agencies-faq summary {
    cursor: pointer;
    font-weight: 650;
    color: #1c1c1e;
    list-style: none;
}

.agencies-faq summary::-webkit-details-marker { display: none; }

.agencies-faq details p {
    margin: .55rem 0 0;
    color: #636366;
}

.agencies-page .btn-teal,
.agencies-page .btn-primary {
    --bs-btn-bg: var(--tj-teal);
    --bs-btn-border-color: var(--tj-teal);
    --bs-btn-hover-bg: var(--tj-teal-dark);
    --bs-btn-hover-border-color: var(--tj-teal-dark);
    box-shadow: 0 8px 24px rgba(29, 184, 174, .26);
}

.agencies-page .btn-outline-teal,
.agencies-page .btn-outline-primary {
    --bs-btn-color: var(--tj-teal-dark);
    --bs-btn-border-color: var(--tj-teal);
    --bs-btn-hover-bg: var(--tj-teal);
    --bs-btn-hover-color: #fff;
}

.travelers-page {
    background:
        radial-gradient(620px 340px at 8% -8%, rgba(5, 190, 212, .18), transparent 52%),
        radial-gradient(520px 280px at 100% 0%, rgba(63, 228, 240, .14), transparent 46%),
        var(--tj-bg);
}

.travelers-page .page-kicker,
.travelers-page .agencies-proof strong,
.travelers-page .agencies-ticket span,
.travelers-page .agencies-marquee-chip,
.travelers-page .agencies-split-col.is-new small,
.travelers-page .agencies-split-mark,
.travelers-page .agencies-brief-no,
.travelers-page .agencies-brief small,
.travelers-page .agencies-bento-ico,
.travelers-page .agencies-step span {
    color: var(--tj-indigo-dark);
}

.travelers-page .agencies-orb-a { background: rgba(5, 190, 212, .22); }
.travelers-page .agencies-orb-b { background: rgba(63, 228, 240, .18); }

.travelers-page .agencies-split-col.is-new {
    background: rgba(5, 190, 212, .1);
    border-color: rgba(5, 190, 212, .2);
}

.travelers-page .agencies-bento-ico {
    background: rgba(5, 190, 212, .12);
}

.travelers-page .agencies-block-tint {
    background: linear-gradient(180deg, rgba(5, 190, 212, .07), transparent 70%);
}

.travelers-page .agencies-fee-band,
.travelers-page .agencies-close {
    background:
        radial-gradient(520px 240px at 12% 0%, rgba(255,255,255,.18), transparent 55%),
        var(--tj-indigo-grad);
}

.travelers-page .agencies-close {
    background:
        radial-gradient(420px 200px at 88% 10%, rgba(255,255,255,.16), transparent 50%),
        linear-gradient(165deg, #05bed4 0%, #0499ad 100%);
}

.travelers-page .btn-teal,
.travelers-page .btn-primary {
    --bs-btn-bg: var(--tj-indigo);
    --bs-btn-border-color: var(--tj-indigo);
    --bs-btn-hover-bg: var(--tj-indigo-dark);
    --bs-btn-hover-border-color: var(--tj-indigo-dark);
    background-image: var(--tj-indigo-grad);
    box-shadow: 0 8px 24px rgba(var(--tj-indigo-rgb), .32);
}

.travelers-page .btn-outline-teal,
.travelers-page .btn-outline-primary {
    --bs-btn-color: var(--tj-indigo-dark);
    --bs-btn-border-color: var(--tj-indigo);
    --bs-btn-hover-bg: var(--tj-indigo);
    --bs-btn-hover-color: #fff;
}

.travelers-page .agencies-close .btn-outline-teal,
.travelers-page .agencies-close .btn-outline-primary {
    --bs-btn-color: var(--tj-indigo-dark);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #fff;
    --bs-btn-hover-bg: #e6fbfe;
    --bs-btn-hover-border-color: #fff;
    --bs-btn-hover-color: var(--tj-indigo-dark);
    color: var(--tj-indigo-dark);
    background: #fff;
    border-color: #fff;
}

@media (max-width: 991px) {
    .agencies-hero-grid,
    .agencies-bento,
    .agencies-steps,
    .agencies-split {
        grid-template-columns: 1fr;
    }
    .agencies-bento-card:first-child { grid-row: auto; }
    .agencies-hero-stage { min-height: 18rem; }
    .agencies-hero-copy h1 { max-width: none; }
    .agencies-hero-copy { text-align: center; }
    .agencies-hero-copy .agencies-lead { margin-left: auto; margin-right: auto; }
    .agencies-hero-copy .agencies-actions { justify-content: center; }
    .agencies-split-mark { transform: rotate(90deg); padding: .2rem 0; }
}

@media (max-width: 767px) {
    .agencies-proof {
        grid-template-columns: 1fr;
    }
    .agencies-hero {
        padding: 2.2rem 0 1.4rem;
    }
    .agencies-ticket.is-back { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .agencies-page [data-reveal],
    .pitch-page [data-reveal],
    .agencies-ticket,
    .agencies-marquee-track {
        animation: none !important;
        opacity: 1;
        transform: none;
        transition: none;
    }
}

.flash-card {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: .9rem 1rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, .9);
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
    border: .5px solid rgba(255, 255, 255, .92);
    box-shadow:
        0 18px 48px rgba(15, 23, 42, .12),
        0 0 0 .5px rgba(5, 190, 212, .12);
    color: var(--tj-ink);
}

.flash-toast {
    position: fixed;
    top: 5.4rem;
    left: 50%;
    z-index: 80;
    min-width: min(20rem, calc(100vw - 2rem));
    max-width: min(26rem, calc(100vw - 2rem));
    padding-bottom: 1.15rem;
    animation: flash-in .42s cubic-bezier(.22, 1, .36, 1) both;
}

.flash-toast.is-out {
    animation: flash-out .28s ease forwards;
}

.notice {
    width: 100%;
    max-width: none;
}

.notice .flash-body a {
    font-weight: 650;
    color: var(--tj-indigo-dark);
}

.flash-flag {
    width: 1.85rem;
    height: 1.35rem;
    object-fit: cover;
    border-radius: 5px;
    box-shadow: 0 0 0 .5px rgba(60, 60, 67, .16);
    flex-shrink: 0;
    margin-top: .15rem;
}

.flash-ico {
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    color: #fff;
    background: var(--tj-indigo-grad);
    box-shadow: 0 8px 18px rgba(var(--tj-indigo-rgb), .28);
}

.flash-card.is-ok .flash-ico {
    background: linear-gradient(165deg, #4adeb0 0%, #12b981 58%, #0f9f70 100%);
    box-shadow: 0 8px 18px rgba(18, 185, 129, .28);
}

.flash-card.is-warn .flash-ico {
    background: linear-gradient(165deg, #fbbf24 0%, #f59e0b 58%, #d97706 100%);
    box-shadow: 0 8px 18px rgba(217, 119, 6, .28);
}

.flash-card.is-error .flash-ico {
    background: linear-gradient(165deg, #fb7185 0%, #e11d48 58%, #be123c 100%);
    box-shadow: 0 8px 18px rgba(225, 29, 72, .26);
}

.flash-ico svg {
    width: 1.05rem;
    height: 1.05rem;
}

.flash-copy {
    display: flex;
    flex-direction: column;
    gap: .12rem;
    min-width: 0;
    flex: 1;
}

.flash-copy strong {
    font-size: .98rem;
    letter-spacing: -.03em;
}

.flash-body,
.flash-copy span {
    color: #636366;
    font-size: .86rem;
    font-weight: 500;
    line-height: 1.4;
}

.flash-body ul {
    margin: 0;
    padding-left: 1.1rem;
}

.flash-body pre {
    margin: .55rem 0 0;
    padding: .65rem .75rem;
    border-radius: 12px;
    background: rgba(28, 28, 30, .06);
    font-size: .8rem;
    white-space: pre-wrap;
    word-break: break-all;
}

.flash-close {
    margin-left: auto;
    align-self: flex-start;
    width: 1.7rem;
    height: 1.7rem;
    border: 0;
    border-radius: 999px;
    background: rgba(118, 118, 128, .12);
    color: #636366;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.flash-close svg {
    width: .7rem;
    height: .7rem;
}

.flash-timer {
    position: absolute;
    left: .9rem;
    right: .9rem;
    bottom: .45rem;
    height: 3px;
    border-radius: 99px;
    background: rgba(var(--tj-indigo-rgb), .14);
    overflow: hidden;
}

.flash-timer::after {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    transform-origin: left;
    background: var(--tj-indigo-grad);
    animation: flash-timer 4.2s linear forwards;
}

.flash-card.is-ok .flash-timer::after {
    background: linear-gradient(165deg, #4adeb0 0%, #12b981 58%, #0f9f70 100%);
}

.flash-card.is-error .flash-timer::after {
    background: linear-gradient(165deg, #fb7185 0%, #e11d48 58%, #be123c 100%);
}

.mode-putujem .flash-toast:not(.is-market):not(.is-error):not(.is-warn) .flash-ico,
.mode-putujem .flash-toast:not(.is-market):not(.is-error):not(.is-warn) .flash-timer::after {
    background: linear-gradient(165deg, #4adeb0 0%, #12b981 58%, #0f9f70 100%);
}

@keyframes flash-in {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(-14px) scale(.96);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0) scale(1);
    }
}

@keyframes flash-out {
    to {
        opacity: 0;
        transform: translateX(-50%) translateY(-10px) scale(.98);
    }
}

@keyframes flash-timer {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}

.account-page {
    padding-top: 2.2rem;
    padding-bottom: 4rem;
    max-width: 760px;
}

.account-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.account-page h1,
.agency-page h1 {
    letter-spacing: -.04em;
}

.account-photo-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.account-photo-row .form-label {
    margin-bottom: .35rem;
}

.profile-photo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 88px;
    flex-shrink: 0;
    border-radius: 50%;
    object-fit: cover;
    background: linear-gradient(165deg, rgba(15, 118, 110, .18), rgba(15, 118, 110, .08));
    color: var(--tj-teal-dark);
    font-weight: 700;
    letter-spacing: -.03em;
    border: .5px solid rgba(255, 255, 255, .85);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
}

.profile-photo.is-logo {
    border-radius: 18px;
}

.dash-hello {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}

.account-gear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    color: var(--tj-muted);
    flex-shrink: 0;
    line-height: 0;
    text-decoration: none;
}

.account-gear svg {
    width: 1.15rem;
    height: 1.15rem;
}

.account-gear:hover,
.account-gear.is-on {
    color: var(--tj-teal-dark);
    background: rgba(15, 118, 110, .1);
}

.agency-kicker-row {
    display: flex;
    align-items: center;
    gap: .2rem;
    margin-top: .35rem;
}

.agency-kicker-row .agency-kicker {
    margin-top: 0;
}

.account-gear.is-compact {
    width: 1.7rem;
    height: 1.7rem;
}

.account-gear.is-compact svg {
    width: 1rem;
    height: 1rem;
}

.blog-cover-field {
    max-width: 28rem;
}

.blog-cover-preview {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 14px;
    background: #f2f2f7;
    margin-bottom: .75rem;
}

.blog-cover-crop-stage {
    max-height: min(70vh, 28rem);
    background: #1c1c1e;
}

.blog-cover-crop-stage img {
    display: block;
    max-width: 100%;
}