:root {
    --red: #b91c1c;
    --red-dark: #8f1717;
    --red-soft: #fff1f1;
    --text: #111827;
    --muted: #6b7280;
    --line: #f3caca;
    --shadow: 0 28px 80px rgba(127, 23, 23, .18);
    --container: 1320px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.public-body {
    margin: 0;
    font-family: 'Inter', sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at 12% 10%, rgba(185, 28, 28, .16), transparent 28%),
        radial-gradient(circle at 92% 20%, rgba(220, 38, 38, .12), transparent 24%),
        linear-gradient(180deg, #fff7f7 0%, #fff1f1 48%, #fffafa 100%);
    overflow-x: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
}

.public-shell {
    min-height: 100vh;
    position: relative;
    overflow: hidden;
}

.public-main {
    position: relative;
    z-index: 5;
    padding: 28px 28px 40px;
}

.public-container {
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
}

/* HEADER */
.public-site-header {
    position: sticky;
    top: 18px;
    z-index: 50;
    margin-bottom: 28px;
}

.public-site-header-inner {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 18px;
    border-radius: 28px;
    background: rgba(255,255,255,.86);
    border: 1px solid var(--line);
    box-shadow: 0 16px 42px rgba(127,23,23,.10);
    backdrop-filter: blur(18px);
}

.brand-wrap {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.brand-badge {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #991b1b);
    font-size: 22px;
    font-weight: 950;
    box-shadow: 0 18px 36px rgba(153,27,27,.26);
}

.brand-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.brand-title {
    font-size: 21px;
    font-weight: 950;
}

.brand-subtitle {
    font-size: 13px;
    color: var(--muted);
    max-width: 520px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.public-site-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.lang-switch {
    display: flex;
    gap: 6px;
    padding: 5px;
    border-radius: 999px;
    background: #fff5f5;
    border: 1px solid var(--line);
}

.lang-pill {
    min-width: 86px;
    padding: 11px 14px;
    border-radius: 999px;
    text-align: center;
    font-size: 13px;
    font-weight: 900;
}

.lang-pill.active {
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #991b1b);
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 17px;
    padding: 14px 19px;
    border: 0;
    font-size: 14px;
    font-weight: 900;
    transition: .2s ease;
}

.btn:hover {
    transform: translateY(-2px);
}

.btn-primary {
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #991b1b);
    box-shadow: 0 18px 34px rgba(153,27,27,.24);
}

.btn-outline {
    background: #fff;
    border: 1px solid var(--line);
}

.btn-glass {
    color: #fff;
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.28);
    backdrop-filter: blur(12px);
}

/* BIG CLEAR HERO */
.home-hero-slider {
    position: relative;
    min-height: 620px;
    border-radius: 42px;
    overflow: hidden;
    background: #111827;
    box-shadow: var(--shadow);
    isolation: isolate;
}

.home-hero-viewport,
.home-hero-track,
.home-hero-slide,
.home-hero-slide-bg {
    width: 100%;
    height: 100%;
}

.home-hero-track {
    display: flex;
    transition: transform .65s cubic-bezier(.22,.61,.36,1);
}

.home-hero-slide {
    min-width: 100%;
    min-height: 620px;
    position: relative;
    flex-shrink: 0;
}

.home-hero-slide-bg {
    position: absolute;
    inset: 0;
}

.home-hero-slide-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    animation: heroZoom 12s ease-in-out infinite alternate;
}

@keyframes heroZoom {
    from { transform: scale(1.01); }
    to { transform: scale(1.07); }
}

.home-hero-slide-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(0,0,0,.80) 0%, rgba(0,0,0,.54) 42%, rgba(0,0,0,.08) 100%),
        linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.28));
}

.home-hero-slide-content {
    position: relative;
    z-index: 7;
    min-height: 620px;
    display: flex;
    align-items: center;
    padding: 70px 72px 100px;
}

.home-hero-copy {
    max-width: 780px;
    color: #fff;
    animation: heroTextIn .8s ease both;
}

@keyframes heroTextIn {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}

.hero-kicker {
    display: inline-flex;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.17);
    color: #fff;
    border: 1px solid rgba(255,255,255,.25);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .05em;
    backdrop-filter: blur(12px);
}

.home-hero-title {
    margin: 20px 0 0;
    font-size: clamp(44px, 5.6vw, 76px);
    line-height: 1.02;
    letter-spacing: -.055em;
    font-weight: 950;
    text-shadow: 0 18px 42px rgba(0,0,0,.34);
}

.home-hero-subtitle {
    max-width: 720px;
    margin: 20px 0 0;
    color: rgba(255,255,255,.92);
    font-size: 18px;
    line-height: 1.85;
}

.home-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.home-hero-controls {
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: 26px;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hero-nav-btn {
    width: 54px;
    height: 54px;
    border-radius: 19px;
    border: 1px solid rgba(255,255,255,.25);
    background: rgba(255,255,255,.16);
    color: #fff;
    font-size: 20px;
    font-weight: 950;
    cursor: pointer;
    backdrop-filter: blur(14px);
}

.hero-dots {
    display: flex;
    gap: 9px;
    padding: 10px 12px;
    border-radius: 999px;
    background: rgba(0,0,0,.22);
    backdrop-filter: blur(14px);
}

.hero-dot {
    width: 11px;
    height: 11px;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.42);
}

.hero-dot.active {
    width: 36px;
    background: #fff;
}

/* BIG CLEAR IMAGE-STYLE ANIMATIONS */
.public-visual {
    position: absolute;
    z-index: 3;
    pointer-events: none;
    filter: drop-shadow(0 22px 36px rgba(153,27,27,.18));
}

/* Ration shop */
.public-visual-shop {
    width: 190px;
    height: 165px;
    left: 42px;
    top: 300px;
    animation: floatShop 6.5s ease-in-out infinite;
}

.shop-roof {
    position: absolute;
    top: 0;
    left: 8px;
    right: 8px;
    height: 48px;
    border-radius: 20px 20px 12px 12px;
    background: repeating-linear-gradient(90deg, #dc2626 0 28px, #fff 28px 56px);
    border: 3px solid rgba(153,27,27,.18);
}

.shop-board {
    position: absolute;
    top: 52px;
    left: 22px;
    right: 22px;
    height: 34px;
    border-radius: 13px;
    background: linear-gradient(135deg, #991b1b, #dc2626);
}

.shop-board::after {
    content: "SHOP";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 13px;
    font-weight: 950;
    letter-spacing: .08em;
}

.shop-door {
    position: absolute;
    left: 72px;
    bottom: 0;
    width: 46px;
    height: 66px;
    border-radius: 14px 14px 6px 6px;
    background: linear-gradient(180deg, #fff, #fecaca);
    border: 3px solid rgba(153,27,27,.18);
}

.shop-window {
    position: absolute;
    right: 24px;
    bottom: 26px;
    width: 38px;
    height: 34px;
    border-radius: 12px;
    background: #fff;
    border: 3px solid rgba(153,27,27,.16);
}

/* Rice bag */
.public-visual-bag {
    width: 120px;
    height: 155px;
    right: 64px;
    top: 230px;
    animation: floatBag 6s ease-in-out infinite;
}

.bag-neck {
    position: absolute;
    top: 0;
    left: 40px;
    width: 42px;
    height: 32px;
    border-radius: 18px 18px 7px 7px;
    background: #f4d18b;
}

.bag-body {
    position: absolute;
    inset: 25px 10px 0;
    border-radius: 30px 30px 36px 36px;
    background: linear-gradient(135deg, #fff4cf, #d6a84d);
    border: 3px solid rgba(120,75,10,.16);
}

.bag-body::after {
    content: "RICE";
    position: absolute;
    left: 22px;
    top: 50px;
    color: #7f1717;
    font-size: 14px;
    font-weight: 950;
}

.bag-rice {
    position: absolute;
    width: 9px;
    height: 21px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 6px 14px rgba(0,0,0,.12);
}

.rice-one { left: 24px; top: 4px; animation: riceFall 3.4s ease-in-out infinite; }
.rice-two { left: 58px; top: 0; animation: riceFall 3.8s ease-in-out infinite .5s; }
.rice-three { right: 22px; top: 8px; animation: riceFall 4.1s ease-in-out infinite .9s; }

/* Scale */
.public-visual-scale {
    width: 160px;
    height: 145px;
    right: 70px;
    bottom: 210px;
    animation: floatScale 7s ease-in-out infinite;
}

.scale-top {
    position: absolute;
    left: 38px;
    top: 18px;
    width: 84px;
    height: 10px;
    border-radius: 999px;
    background: #991b1b;
}

.scale-stand {
    position: absolute;
    left: 75px;
    top: 27px;
    width: 10px;
    height: 78px;
    border-radius: 999px;
    background: #991b1b;
}

.scale-base {
    position: absolute;
    left: 48px;
    bottom: 8px;
    width: 66px;
    height: 18px;
    border-radius: 999px 999px 10px 10px;
    background: #dc2626;
}

.scale-pan {
    position: absolute;
    width: 58px;
    height: 20px;
    border-radius: 0 0 999px 999px;
    background: #fff;
    border: 3px solid rgba(153,27,27,.20);
}

.scale-pan-left {
    left: 2px;
    top: 62px;
    animation: panLeft 2.8s ease-in-out infinite;
}

.scale-pan-right {
    right: 2px;
    top: 62px;
    animation: panRight 2.8s ease-in-out infinite;
}

/* ID card */
.public-visual-card {
    width: 150px;
    height: 96px;
    left: 72px;
    bottom: 155px;
    border-radius: 22px;
    background: rgba(255,255,255,.9);
    border: 1px solid var(--line);
    backdrop-filter: blur(14px);
    animation: floatCard 7.8s ease-in-out infinite;
}

.id-avatar {
    position: absolute;
    width: 38px;
    height: 38px;
    left: 16px;
    top: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, #dc2626, #991b1b);
}

.id-line {
    position: absolute;
    height: 8px;
    border-radius: 999px;
    background: rgba(153,27,27,.18);
    left: 66px;
}

.id-line-1 {
    top: 26px;
    width: 58px;
}

.id-line-2 {
    top: 44px;
    width: 44px;
}

.id-chip {
    position: absolute;
    width: 38px;
    height: 15px;
    left: 18px;
    bottom: 14px;
    border-radius: 999px;
    background: #facc15;
}

/* Union flag */
.public-visual-flag {
    width: 120px;
    height: 145px;
    right: 245px;
    top: 122px;
    animation: floatFlag 6.8s ease-in-out infinite;
}

.flag-pole {
    position: absolute;
    width: 8px;
    height: 130px;
    left: 12px;
    top: 6px;
    border-radius: 999px;
    background: #991b1b;
}

.flag-cloth {
    position: absolute;
    left: 20px;
    top: 10px;
    width: 86px;
    height: 54px;
    border-radius: 9px 24px 24px 9px;
    background: linear-gradient(135deg, #dc2626, #991b1b);
    transform-origin: left center;
    animation: flagWave 2.3s ease-in-out infinite;
}

.flag-cloth::after {
    content: "";
    position: absolute;
    inset: 15px 22px;
    border-radius: 999px;
    background: rgba(255,255,255,.9);
}

/* Grains */
.grain-field {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.grain-dot {
    position: absolute;
    width: 10px;
    height: 22px;
    border-radius: 999px;
    background: rgba(255,255,255,.85);
    box-shadow: 0 8px 18px rgba(153,27,27,.13);
    animation: grainDrift 7s ease-in-out infinite;
}

.g1 { left: 9%; top: 24%; }
.g2 { left: 16%; top: 66%; animation-delay: .6s; }
.g3 { right: 9%; top: 33%; animation-delay: 1s; }
.g4 { right: 15%; top: 72%; animation-delay: 1.4s; }
.g5 { left: 6%; top: 82%; animation-delay: 2s; }
.g6 { right: 28%; top: 15%; animation-delay: 2.3s; }
.g7 { left: 27%; top: 15%; animation-delay: 2.7s; }
.g8 { right: 6%; top: 56%; animation-delay: 3.1s; }
.g9 { left: 45%; bottom: 8%; animation-delay: 3.5s; }

@keyframes riceFall {
    0%,100% { transform: translateY(0) rotate(22deg); opacity: .45; }
    50% { transform: translateY(38px) rotate(72deg); opacity: 1; }
}

@keyframes panLeft {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(10px); }
}

@keyframes panRight {
    0%,100% { transform: translateY(10px); }
    50% { transform: translateY(0); }
}

@keyframes grainDrift {
    0%,100% { transform: translateY(0) rotate(18deg); opacity: .36; }
    50% { transform: translateY(-36px) translateX(18px) rotate(70deg); opacity: .86; }
}

@keyframes floatShop {
    0%,100% { transform: translateY(0) rotate(-3deg); }
    50% { transform: translateY(-22px) rotate(4deg); }
}

@keyframes floatBag {
    0%,100% { transform: translateY(0) rotate(5deg); }
    50% { transform: translateY(24px) rotate(-4deg); }
}

@keyframes floatScale {
    0%,100% { transform: translateY(0) rotate(-2deg); }
    50% { transform: translateY(-22px) rotate(3deg); }
}

@keyframes floatCard {
    0%,100% { transform: translateY(0) rotate(4deg); }
    50% { transform: translateY(-26px) rotate(-5deg); }
}

@keyframes floatFlag {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-22px); }
}

@keyframes flagWave {
    0%,100% { transform: skewY(0deg) scaleX(1); }
    50% { transform: skewY(-8deg) scaleX(1.08); }
}

/* Cards */
.home-section {
    margin-top: 46px;
}

.section-heading-center,
.section-heading-split {
    margin-bottom: 24px;
}

.section-heading-center {
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.eyebrow {
    display: inline-flex;
    padding: 9px 13px;
    border-radius: 999px;
    background: #fff;
    color: #991b1b;
    border: 1px solid var(--line);
    font-size: 12px;
    font-weight: 950;
    box-shadow: var(--shadow-sm);
}

.section-title {
    margin: 14px 0 0;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.12;
    letter-spacing: -.035em;
    font-weight: 950;
}

.section-subtitle {
    margin: 12px 0 0;
    color: var(--muted);
    line-height: 1.8;
}

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

.public-info-card,
.post-card,
.empty-card {
    overflow: hidden;
    border-radius: 32px;
    background: rgba(255,255,255,.92);
    border: 1px solid var(--line);
    box-shadow: var(--shadow-sm);
    transition: .22s ease;
}

.public-info-card:hover,
.post-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-md);
}

.public-info-image,
.post-card-image-wrap,
.post-card-placeholder {
    height: 230px;
    overflow: hidden;
    background: #fff1f1;
}

.public-info-image img,
.post-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .45s ease;
}

.public-info-card:hover img,
.post-card:hover img {
    transform: scale(1.06);
}

.public-info-content,
.post-card-body {
    padding: 24px;
}

.public-info-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    border-radius: 21px;
    color: #991b1b;
    background: linear-gradient(135deg, #fff0f0, #fff);
    border: 1px solid var(--line);
    font-weight: 950;
}

.public-info-title,
.post-card-title {
    margin: 0;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 950;
}

.public-info-text,
.post-card-summary {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.8;
}

.post-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 13px;
}

.post-meta span {
    padding: 7px 10px;
    border-radius: 999px;
    background: #fee2e2;
    color: #991b1b;
    font-size: 11px;
    font-weight: 950;
}

.read-more-link {
    display: inline-flex;
    margin-top: 18px;
    color: #991b1b;
    font-weight: 950;
}

.simple-public-footer {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-top: 46px;
    padding: 22px 24px;
    border-radius: 26px;
    background: rgba(255,255,255,.86);
    border: 1px solid var(--line);
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
    box-shadow: var(--shadow-sm);
}

@media (max-width: 1080px) {
    .grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    .public-visual,
    .grain-field,
    .visual-cloud {
        opacity: .5;
    }
}

@media (max-width: 860px) {
    .public-main {
        padding: 16px 12px 28px;
    }

    .public-site-header {
        position: relative;
        top: auto;
    }

    .public-site-header-inner {
        flex-direction: column;
        align-items: stretch;
    }

    .brand-subtitle {
        white-space: normal;
        max-width: 100%;
    }

    .public-site-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .lang-switch {
        width: 100%;
    }

    .lang-pill {
        flex: 1;
    }

    .btn {
        width: 100%;
    }

    .home-hero-slider,
    .home-hero-slide,
    .home-hero-slide-content {
        min-height: 500px;
    }

    .home-hero-slide-content {
        padding: 34px 24px 94px;
        align-items: flex-end;
    }

    .home-hero-title {
        font-size: 34px;
    }

    .home-hero-subtitle {
        font-size: 15px;
    }

    .home-hero-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .home-hero-controls {
        left: 18px;
        right: 18px;
        bottom: 18px;
    }

    .public-visual,
    .grain-field,
    .visual-cloud {
        display: none;
    }

    .grid-3 {
        grid-template-columns: 1fr;
    }

    .simple-public-footer {
        flex-direction: column;
    }
}


.visual-rice-sack-2,
.visual-sugar-pack,
.visual-dal-pack,
.visual-register-book,
.visual-megaphone,
.visual-employee-cap,
.visual-name-badge,
.visual-notice-board,
.visual-handshake,
.visual-coin-stack,
.visual-document,
.visual-check-seal,
.visual-calendar,
.visual-mobile-otp,
.visual-location-pin,
.visual-people-group {
    width: 72px;
    height: 72px;
    border-radius: 22px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--line);
    backdrop-filter: blur(14px);
}

/* rice sack */
.visual-rice-sack-2 {
    left: 265px;
    top: 205px;
    background: linear-gradient(135deg, #fff4cf, #d6a84d);
    animation: iconFloatA 7s ease-in-out infinite;
}
.visual-rice-sack-2::after {
    content: "R";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #991b1b;
    font-weight: 950;
    font-size: 24px;
}

/* sugar */
.visual-sugar-pack {
    right: 290px;
    top: 285px;
    animation: iconFloatB 8s ease-in-out infinite;
}
.visual-sugar-pack::after {
    content: "S";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #991b1b;
    font-weight: 950;
    font-size: 24px;
}

/* dal */
.visual-dal-pack {
    left: 240px;
    bottom: 300px;
    background: linear-gradient(135deg, #fff7ed, #fdba74);
    animation: iconFloatC 8.5s ease-in-out infinite;
}
.visual-dal-pack::after {
    content: "D";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #9a3412;
    font-weight: 950;
    font-size: 24px;
}

/* register book */
.visual-register-book {
    right: 365px;
    bottom: 290px;
    background: linear-gradient(135deg, #ffffff, #fee2e2);
    animation: iconFloatA 9s ease-in-out infinite reverse;
}
.visual-register-book::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 14px;
    width: 8px;
    height: 44px;
    border-radius: 999px;
    background: #991b1b;
}
.visual-register-book::after {
    content: "";
    position: absolute;
    left: 34px;
    top: 22px;
    width: 24px;
    height: 6px;
    border-radius: 999px;
    background: rgba(153,27,27,.25);
    box-shadow: 0 14px 0 rgba(153,27,27,.18);
}

/* megaphone */
.visual-megaphone {
    left: 142px;
    top: 520px;
    animation: megaphonePulse 4s ease-in-out infinite;
}
.visual-megaphone::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 28px;
    width: 36px;
    height: 22px;
    clip-path: polygon(0 25%, 70% 0, 100% 50%, 70% 100%, 0 75%);
    background: #dc2626;
}
.visual-megaphone::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 22px;
    width: 18px;
    height: 30px;
    border: 3px solid rgba(220,38,38,.35);
    border-left: none;
    border-radius: 0 999px 999px 0;
}

/* employee cap */
.visual-employee-cap {
    right: 145px;
    top: 490px;
    animation: iconFloatB 7.5s ease-in-out infinite;
}
.visual-employee-cap::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 26px;
    width: 36px;
    height: 18px;
    border-radius: 18px 18px 6px 6px;
    background: #991b1b;
}
.visual-employee-cap::after {
    content: "";
    position: absolute;
    left: 13px;
    top: 42px;
    width: 46px;
    height: 8px;
    border-radius: 999px;
    background: #dc2626;
}

/* name badge */
.visual-name-badge {
    left: 315px;
    top: 420px;
    animation: iconFloatC 8s ease-in-out infinite reverse;
}
.visual-name-badge::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 18px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #dc2626;
}
.visual-name-badge::after {
    content: "";
    position: absolute;
    left: 38px;
    top: 22px;
    width: 22px;
    height: 6px;
    border-radius: 999px;
    background: rgba(153,27,27,.28);
    box-shadow: 0 13px 0 rgba(153,27,27,.18);
}

/* notice board */
.visual-notice-board {
    right: 220px;
    bottom: 430px;
    animation: iconFloatA 8.8s ease-in-out infinite;
}
.visual-notice-board::before {
    content: "";
    position: absolute;
    inset: 14px;
    border-radius: 12px;
    background: #fee2e2;
    border: 2px solid #dc2626;
}
.visual-notice-board::after {
    content: "";
    position: absolute;
    left: 27px;
    top: 27px;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    background: #991b1b;
    box-shadow: 0 12px 0 rgba(153,27,27,.35), 0 24px 0 rgba(153,27,27,.22);
}

/* handshake simple */
.visual-handshake {
    left: 470px;
    bottom: 150px;
    animation: iconFloatB 7.7s ease-in-out infinite;
}
.visual-handshake::before,
.visual-handshake::after {
    content: "";
    position: absolute;
    top: 31px;
    width: 34px;
    height: 14px;
    border-radius: 999px;
    background: #dc2626;
}
.visual-handshake::before {
    left: 10px;
    transform: rotate(24deg);
}
.visual-handshake::after {
    right: 10px;
    transform: rotate(-24deg);
}

/* coin stack */
.visual-coin-stack {
    right: 470px;
    bottom: 155px;
    animation: coinBounce 4.6s ease-in-out infinite;
}
.visual-coin-stack::before {
    content: "";
    position: absolute;
    left: 21px;
    bottom: 16px;
    width: 30px;
    height: 10px;
    border-radius: 50%;
    background: #facc15;
    box-shadow: 0 -10px 0 #fde047, 0 -20px 0 #facc15;
}
.visual-coin-stack::after {
    content: "";
    position: absolute;
    left: 30px;
    top: 12px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #991b1b;
}

/* document */
.visual-document {
    left: 550px;
    top: 155px;
    animation: iconFloatC 9s ease-in-out infinite;
}
.visual-document::before {
    content: "";
    position: absolute;
    inset: 13px 17px;
    border-radius: 10px;
    background: #fff;
    border: 2px solid #fecaca;
}
.visual-document::after {
    content: "";
    position: absolute;
    left: 29px;
    top: 28px;
    width: 23px;
    height: 5px;
    border-radius: 999px;
    background: #991b1b;
    box-shadow: 0 12px 0 rgba(153,27,27,.24), 0 24px 0 rgba(153,27,27,.16);
}

/* check seal */
.visual-check-seal {
    right: 545px;
    top: 185px;
    border-radius: 50%;
    animation: sealPulse 4s ease-in-out infinite;
}
.visual-check-seal::before {
    content: "✓";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #15803d;
    font-size: 34px;
    font-weight: 950;
}

/* calendar */
.visual-calendar {
    left: 385px;
    bottom: 420px;
    animation: iconFloatA 8.2s ease-in-out infinite reverse;
}
.visual-calendar::before {
    content: "";
    position: absolute;
    inset: 15px;
    border-radius: 12px;
    background: #fff;
    border: 2px solid #fecaca;
}
.visual-calendar::after {
    content: "";
    position: absolute;
    left: 15px;
    right: 15px;
    top: 20px;
    height: 14px;
    border-radius: 10px 10px 0 0;
    background: #dc2626;
}

/* mobile otp */
.visual-mobile-otp {
    right: 390px;
    top: 430px;
    animation: phoneShake 5s ease-in-out infinite;
}
.visual-mobile-otp::before {
    content: "";
    position: absolute;
    left: 24px;
    top: 11px;
    width: 25px;
    height: 50px;
    border-radius: 10px;
    background: #111827;
}
.visual-mobile-otp::after {
    content: "";
    position: absolute;
    left: 30px;
    top: 24px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 0 0 0 7px rgba(220,38,38,.15);
}

/* location */
.visual-location-pin {
    left: 640px;
    bottom: 330px;
    border-radius: 50%;
    animation: pinDrop 5.5s ease-in-out infinite;
}
.visual-location-pin::before {
    content: "";
    position: absolute;
    left: 25px;
    top: 13px;
    width: 22px;
    height: 30px;
    border-radius: 50% 50% 50% 0;
    background: #dc2626;
    transform: rotate(-45deg);
}
.visual-location-pin::after {
    content: "";
    position: absolute;
    left: 32px;
    top: 21px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
}

/* people group */
.visual-people-group {
    right: 620px;
    bottom: 350px;
    animation: iconFloatB 7.2s ease-in-out infinite reverse;
}
.visual-people-group::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 18px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 20px 0 0 #991b1b, 40px 0 0 #dc2626;
}
.visual-people-group::after {
    content: "";
    position: absolute;
    left: 10px;
    top: 38px;
    width: 52px;
    height: 18px;
    border-radius: 18px 18px 8px 8px;
    background: #fecaca;
}

/* Animation keyframes */
@keyframes iconFloatA {
    0%,100% { transform: translateY(0) rotate(-4deg); }
    50% { transform: translateY(-22px) rotate(5deg); }
}

@keyframes iconFloatB {
    0%,100% { transform: translateY(0) translateX(0) rotate(4deg); }
    50% { transform: translateY(20px) translateX(-16px) rotate(-5deg); }
}

@keyframes iconFloatC {
    0%,100% { transform: translateY(0) translateX(0) scale(1); }
    50% { transform: translateY(-18px) translateX(18px) scale(1.06); }
}

@keyframes megaphonePulse {
    0%,100% { transform: scale(1) rotate(-5deg); }
    50% { transform: scale(1.08) rotate(5deg); }
}

@keyframes coinBounce {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-24px); }
}

@keyframes sealPulse {
    0%,100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(21,128,61,.18); }
    50% { transform: scale(1.08); box-shadow: 0 0 0 14px rgba(21,128,61,.06); }
}

@keyframes phoneShake {
    0%,100% { transform: rotate(0deg) translateY(0); }
    30% { transform: rotate(-4deg) translateY(-10px); }
    60% { transform: rotate(4deg) translateY(8px); }
}

@keyframes pinDrop {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-28px); }
}

@media (max-width: 1080px) {
    .visual-rice-sack-2,
    .visual-sugar-pack,
    .visual-dal-pack,
    .visual-register-book,
    .visual-megaphone,
    .visual-employee-cap,
    .visual-name-badge,
    .visual-notice-board,
    .visual-handshake,
    .visual-coin-stack,
    .visual-document,
    .visual-check-seal,
    .visual-calendar,
    .visual-mobile-otp,
    .visual-location-pin,
    .visual-people-group {
        opacity: .35;
    }
}

@media (max-width: 860px) {
    .visual-rice-sack-2,
    .visual-sugar-pack,
    .visual-dal-pack,
    .visual-register-book,
    .visual-megaphone,
    .visual-employee-cap,
    .visual-name-badge,
    .visual-notice-board,
    .visual-handshake,
    .visual-coin-stack,
    .visual-document,
    .visual-check-seal,
    .visual-calendar,
    .visual-mobile-otp,
    .visual-location-pin,
    .visual-people-group {
        display: none;
    }
}



/* Header nav fix */
.public-site-header-inner{
    align-items:center;
}

.public-site-actions{
    flex-wrap: nowrap !important;
    gap: 14px;
}

.public-nav{
    display:flex;
    align-items:center;
    gap:16px;
    white-space:nowrap;
}

.nav-link{
    color:#1e293b;
    font-weight:900;
    font-size:14px;
    text-decoration:none;
    transition:.2s ease;
}

.nav-link:hover{
    color:#991b1b;
}

@media(max-width:1180px){
    .public-nav{
        display:none;
    }

    .public-site-actions{
        flex-wrap:wrap !important;
    }
}



/* =========================
   FINAL HEADER FIX
========================= */

.public-site-actions{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:nowrap;
}

.public-nav{
    display:flex;
    align-items:center;
    gap:18px;
    white-space:nowrap;
}

.nav-link{
    color:#374151;
    font-size:15px;
    font-weight:800;
    transition:.2s ease;
}

.nav-link:hover{
    color:#b91c1c;
}

.btn-header{
    white-space:nowrap;
}

/* DESKTOP */
@media (min-width: 861px){

    .public-site-header-inner{
        display:flex;
        align-items:center;
        justify-content:space-between;
    }

    .public-site-actions{
        flex-direction:row;
    }

    .btn-header{
        width:auto !important;
    }
}

/* MOBILE */
@media (max-width: 860px){

    .public-site-header-inner{
        flex-direction:column;
        align-items:center;
        text-align:center;
        gap:18px;
    }

    .brand-wrap{
        justify-content:center;
        text-align:center;
    }

    .brand-copy{
        align-items:center;
    }

    .brand-subtitle{
        white-space:normal;
        text-align:center;
    }

    .public-nav{
        display:none;
    }

    .public-site-actions{
        width:100%;
        flex-direction:column;
        align-items:center;
        gap:14px;
    }

    .lang-switch{
        width:100%;
        max-width:290px;
    }

    .lang-pill{
        flex:1;
    }

    .btn-header{
        width:100% !important;
        max-width:290px;
        justify-content:center;
    }
}

/* =========================
   FINAL RESPONSIVE HEADER
========================= */

.public-site-actions{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:nowrap;
}

.public-nav{
    display:flex;
    align-items:center;
    gap:18px;
}

.nav-link{
    color:#374151;
    font-size:15px;
    font-weight:800;
    text-decoration:none;
    transition:.2s ease;
}

.nav-link:hover{
    color:#b91c1c;
}

.mobile-public-nav{
    display:none;
}

/* DESKTOP */
@media(min-width:861px){

    .public-site-header-inner{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:20px;
    }

    .btn-header{
        width:auto !important;
        white-space:nowrap;
    }
}

/* MOBILE */
@media(max-width:860px){

    .public-site-header-inner{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
        gap:18px;
    }

    .brand-wrap{
        justify-content:center;
        text-align:center;
    }

    .brand-copy{
        align-items:center;
    }

    .brand-subtitle{
        text-align:center;
        white-space:normal;
    }

    .public-nav{
        display:none;
    }

    .public-site-actions{
        width:100%;
        flex-direction:column;
        align-items:center;
        gap:14px;
    }

    .lang-switch{
        width:100%;
        max-width:300px;
    }

    .lang-pill{
        flex:1;
    }

    .btn-header{
        width:100% !important;
        max-width:300px;
        justify-content:center;
    }

    .mobile-public-nav{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:10px;
        width:100%;
        margin-top:2px;
    }

    .mobile-public-nav a{
        display:flex;
        align-items:center;
        justify-content:center;
        min-height:46px;
        padding:10px 12px;
        border-radius:16px;
        background:#fff7f7;
        border:1px solid #f3caca;
        color:#991b1b;
        font-size:14px;
        font-weight:900;
        text-decoration:none;
    }

    .mobile-public-nav a:first-child{
        grid-column:span 2;
        background:linear-gradient(135deg,#dc2626,#991b1b);
        color:#fff;
    }
}

@media (max-width: 560px) {
    .home-hero-slider,
    .home-hero-slide,
    .home-hero-slide-content {
        min-height: 430px;
        border-radius: 26px;
    }

    .home-hero-slide-content {
        padding: 24px 18px 90px;
    }

    .home-hero-title {
        font-size: 27px;
    }

    .home-hero-subtitle {
        font-size: 14px;
    }

    .public-info-image,
    .post-card-image-wrap,
    .post-card-placeholder {
        height: 185px;
    }
}