/* Portfolio polish layer: keeps the original Healia visual language, adds the Agung identity. */
.nav-sticky-on {
    box-shadow: 0 16px 40px rgba(16, 47, 59, .14);
    transform: translateY(-2px);
}

.agung-brand-mark {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    overflow: hidden;
    flex: 0 0 30px;
}

.agung-brand-mark img {
    position: absolute;
    width: 54px;
    height: 54px;
    max-width: none;
    left: -12px;
    top: -12px;
}

.agung-brand-mark-footer { width: 34px; height: 34px; flex-basis: 34px; }
.agung-brand-mark-footer img { width: 61px; height: 61px; left: -13.5px; top: -13.5px; }

.care-focus-button {
    padding: 18px 16px;
    border: 1px solid #c9dedb;
    border-radius: 12px;
    background: rgba(255, 255, 255, .55);
    color: #244c56;
    text-align: left;
    font-weight: 600;
    transition: .25s ease;
}

.care-focus-button:hover,
.care-focus-button.active {
    border-color: #2aa89a;
    background: #102f3b;
    color: #f2f9f7;
    transform: translateY(-2px);
}

.principles-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 28px;
    color: #5f7477;
    font-size: 14px;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.principles-strip span::before { content: "✦"; color: #2aa89a; margin-right: 9px; }
.principle-card { padding: 32px; border: 1px solid #c9dedb; border-radius: 18px; background: #fff; }
.principle-card-dark { background: #102f3b; color: #f2f9f7; border-color: #102f3b; }
.principle-card-dark h3 { color: #f2f9f7; }
.principle-number { color: #2aa89a; font-size: 13px; font-weight: 700; letter-spacing: .1em; margin-bottom: 64px; }

.made-by-badge {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 150;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 9px 13px;
    border: 1px solid rgba(42, 168, 154, .4);
    border-radius: 999px;
    background: rgba(16, 47, 59, .95);
    color: #fdf6ee;
    box-shadow: 0 12px 30px rgba(16, 47, 59, .22);
    font-size: 12px;
    line-height: 1;
    backdrop-filter: blur(12px);
}

.made-by-badge span { color: #c9dedb; }
.made-by-badge strong { color: #72d8ca; font-weight: 700; }
.made-by-badge a { color: #f2f9f7; text-decoration: underline; text-underline-offset: 3px; }
.made-by-badge a:hover { color: #72d8ca; }

@media (max-width: 1023px) {
    header .nav-sticky { border-radius: 18px; }
}

@media (max-width: 639px) {
    .made-by-badge { right: 12px; bottom: 12px; padding: 8px 10px; gap: 5px; font-size: 11px; }
    footer form { flex-direction: column; gap: 8px; }
    footer form input, footer form button { border-radius: 8px; }
    footer form button { min-height: 48px; }
}