/* ============================================================
   GLOBAL RESET & BASE STYLES
   ============================================================ */
* { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box;
    box-sizing: border-box; 
}

html, body {
    min-height: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}

body {
    margin: 0;
    background-color: #0C9;
}

input, textarea, select, option {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    font-size: 1em;
}

a {
    text-decoration: none;
}

div {
    font-family: Arial, Helvetica, sans-serif;
}

table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: #ccb78f;
    font-size: 1rem;
}

/* ============================================================
   NAVIGATION & LAYOUT COMPONENTS
   ============================================================ */

/* Close Button */
.r_cbtn { 
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
    display: none;
    z-index: 11;
}

/* Hamburger Menu */
.r_micon {
    position: absolute;
    top: 20px;
    left: 10px;
    display: none;
    z-index: 12;
    transition: 1s;
}
.r_miconl {
    background-color: #444444;
    width: 35px;
    height: 5px;
    margin: 6px;
}

/* Sticky Header */
.k_sticky0 {
    position: fixed; 
    top: 0;
    width: 100%;
    height: auto;
    transition: 1s;
    background-color: #f4f4f4;
    overflow: hidden;
    z-index: 10;
}
.k_sticky1 {
    position: sticky;
}

/* ============================================================
   CHAT & BOT COMPONENTS
   ============================================================ */
.k_bot0 { 
    z-index: 101; 
    position: fixed;
    bottom: 5px;
    right: 30px; 
    width: 25vw;
    aspect-ratio: 1/1.2; 
    background-color: #f1f1f1;
    box-shadow: 0 0 10px 1px #000;
    border-radius: 9px 9px 0 0;
    overflow: hidden;
    display: none;
}

/* Shared chat bubble base */
.k_bot5, .k_bot6, .k_userbot, .k_sysbot {
    width: auto;
    max-width: 80%;
    padding: 10px;
    white-space: pre-wrap;
}
.k_bot5 { 
    border-radius: 0 10px 10px 10px;
    background-color: #f6eded;
    float: left; 
}
.k_bot6 { 
    border-radius: 10px 0 10px 10px;
    background-color: #fdf9f1;
    float: right; 
}
.k_chatline {
    width: 100%;
    padding: 5px;
    float: left;
}
.k_userbot {
    border-radius: 10px 0 10px 10px;
    background-color: #ffe0e0;
    float: right;
}
.k_sysbot { 
    display: inline-block;
    padding: 20px;
    border-radius: 0 10px 10px 10px;
    background-color: #f1f1f1;  
}
.k_chat {
    width: 16vw;
    aspect-ratio: 1/1;
    position: fixed;
    bottom: 10px;
    right: 30px;
    padding: 0.5%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

/* ============================================================
   LOADING & MESSAGE DIALOGS
   ============================================================ */

/* Loading Progress */
.tt_loading {
    position: absolute;
    left: calc(50% - 60px);
    top: calc(40% - 60px);
    width: 120px;
    height: 120px;  
    z-index: 21;
    display: none;
}
.tt_loader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid orange;
    border-bottom: 16px solid #000;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Shared overlay box base */
.msg_box, .dlg_box {
    position: absolute;
    top: 25%;
    left: 10%;
    width: 80%;
    height: 50%;
    box-shadow: 0 0 10px 1px #000;
    background-color: #f0f0f0;
    border-radius: 3px;
    z-index: 20;
    display: none;
}

/* Message Box */
.msg_txt {
    position: absolute;
    top: 40%;
    width: 100%;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    padding: 20px;
    transform: translateY(-50%);
}
.msg_okbtn {
    position: absolute;
    top: 80%;
    width: 100%;
    height: 20%;
    text-align: center;
    font-weight: bolder;
    z-index: 2;
    font-size: 20px;
    color: #000;
    text-decoration: underline;
}

/* Dialog Box */
.dlg_txt {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 80%;
    height: 50%;
    font-family: Arial, Helvetica, sans-serif;
    margin: auto;
    text-align: center; 
    font-size: 12px;
}

/* ============================================================
   CARDS & CONTAINERS
   ============================================================ */

/* Shared card base */
.tt_card1, .tt_card2, .tt_card3 {
    width: 100%;
    height: auto;
    float: left;
}
.tt_card1 {
    background: linear-gradient(to bottom, white, white, white, #efefef); 
}
.tt_card2 {
    overflow: hidden;
    background: linear-gradient(to bottom, white, white, white, #efefef);    
    padding: 10px;
}
.tt_card3 {
    overflow: hidden;
    background-color: navy;
    padding: 10px;
    color: white;
}
.tt_card50x100 {
    width: 50%;
    height: 100%;
    float: left;
}
.tt_card300xa {
    width: 300px;
    height: auto;
}

/* ============================================================
   SLIDER & ANIMATIONS
   ============================================================ */
.k_slidercase {
    width: 100%;
    height: 100%;
    overflow: hidden; 
}
.k_slider {
    width: 300%;
    height: 100%;
    animation: slideAnimation 30s infinite;
}
.k_slide {
    width: 33.33%;
    height: 100%;
    float: left;
    transition: 0.5s;
    padding: 1vw 2vw;
}
@keyframes slideAnimation {
    0%, 20% { transform: translateX(0); }
    25%, 45% { transform: translateX(-33.33%); }
    50%, 70% { transform: translateX(-66.66%); }
    75%, 95% { transform: translateX(-33.33%); }
}

/* ============================================================
   LAYOUT UTILITIES
   ============================================================ */
.k_line {
    width: 100%;
    padding: 5px 20px;
}
.k_line50 {
    width: 100%;
    height: 50px;
    padding: 5px 20px;
    line-height: 40px;
}
.k_line80 {
    width: 100%;
    height: 80px;
    padding: 5px 20px;
    line-height: 40px;
}
.k_hidden {
    left: 100%;
}
.k_ph1 {
   width: 15%;
   height: 80%;
   float: left;  
}
.k_logo1 {
    width: 80%;
    height: auto;
    float: left;
    padding: 5px;
}
.k_dtm {
    display: none;
    width: 50%;
    height: 80%;
    float: left;
    padding: 5px;
}

/* ============================================================
   APPLICATION BODY & PAGES
   ============================================================ */

/* Application Body */
.tt_body {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 1;
    background-color: #f1f1f1;
}

/* General Page */
.tt_page {
    position: absolute;
    left: -100%;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    overflow-y: scroll;
    z-index: 2;    
    transition: 0.5s;
}
/* Page Elements */
.hp_holder {
    width: 100%;
    height: 80px;
    text-align: center;
    line-height: 60px;
    font-weight: bold;
}
.tt_pgh {
    width: 100%;
    height: auto;
}
.tt_imgw100xa {
    width: calc(100% - 1px);
    height: auto;  
}
.ttmnu_list {
    width: 100%;
    height: 75px;
    background-color: #fff;
    text-align: left;
    border-bottom: solid #cacaca 1px;
    font-size: 12px;
    line-height: 25px;
}
.tt_listah {
    width: 100%;
    height: auto;
    background-color: #fff;
    padding: 15px;
    text-align: left;
    border-bottom: solid #cacaca 1px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 25px;
}

/* Business-Folio home page */
.bf_page {
    --bf-orange: orange;
    --bf-black: #000000;
    --bf-white: #ffffff;
    --bf-gray: #d4d4d4;
    --bf-dark-gray: #5a5a5a;
    --bf-light-gray: #f1f1f1;
    --bf-ink: #141414;
    --bf-muted: #565656;
    --bf-border: #cfcfcf;
    width: 100%;
    min-height: 100%;
    float: left;
    background-color: var(--bf-light-gray);
    color: var(--bf-ink);
    font-family: Arial, Helvetica, sans-serif;
}
.bf_section {
    padding: 38px 7vw 44px;
}
.bf_bar {
    min-height: 68px;
    justify-content: space-between;
    gap: 24px;
    padding: 14px 7vw;
    background-color: var(--bf-gray);
    border-bottom: 1px solid var(--bf-orange);
    position: sticky;
    top: 0;
    z-index: 50;
}
.bf_brand {
    gap: 12px;
}
.bf_brand_name {
    color: var(--bf-black);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.04em;
}
.bf_brand_tag {
    margin-top: 2px;
    color: var(--bf-dark-gray);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.bf_logo,
.bf_ui_icon_lg {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
}
.bf_logo polygon:nth-child(1),
.bf_logo polygon:nth-child(3) {
    fill: var(--bf-orange);
    stroke: var(--bf-orange);
}
.bf_logo polygon:nth-child(2) {
    fill: var(--bf-black);
    stroke: var(--bf-black);
}
.bf_links {
    margin-left: auto;
    gap: 28px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    text-align: right;
}
.bf_links a {
    color: var(--bf-black);
}
.bf_links a:hover {
    color: var(--bf-orange);
}
.bf_section_hero {
    min-height: 58vh;
    gap: clamp(24px, 5vw, 60px);
    padding-top: clamp(36px, 5vw, 64px);
    padding-bottom: clamp(36px, 5vw, 64px);
    background: linear-gradient(110deg, var(--bf-white) 0%, var(--bf-white) 58%, var(--bf-gray) 58%, var(--bf-gray) 100%);
    border-bottom: 1px solid var(--bf-border);
}
.bf_stack {
    flex-direction: column;
    gap: 10px;
}
.bf_col_wide {
    width: 58%;
    max-width: 800px;
}
.bf_kicker {
    gap: 8px;
    color: var(--bf-dark-gray);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.14em;
}
.bf_kicker svg circle {
    fill: var(--bf-orange);
}
.bf_display {
    max-width: 700px;
    margin: 4px 0 0;
    color: var(--bf-black);
    font-size: clamp(34px, 4.5vw, 58px);
    line-height: 1.04;
    letter-spacing: 0;
    font-weight: 900;
}
.bf_display em {
    color: var(--bf-orange);
    font-style: normal;
}
.bf_lead {
    max-width: 560px;
    margin: 10px 0 0;
    color: var(--bf-muted);
    font-size: clamp(15px, 1.3vw, 18px);
    line-height: 1.55;
}
.bf_lead_sub {
    margin-top: 0;
    color: var(--bf-dark-gray);
    font-weight: 700;
}
.bf_cta_row {
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 8px;
}
.bf_cta,
.bf_cta_ghost {
    gap: 8px;
    min-height: 42px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 800;
}
.bf_cta {
    padding: 12px 24px;
    background-color: var(--bf-orange);
    color: var(--bf-black);
    border: 2px solid var(--bf-orange);
}
.bf_cta_ghost {
    padding: 12px 20px;
    color: var(--bf-black);
    border: 2px solid var(--bf-black);
    background-color: transparent;
}
.bf_chip_list {
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}
.bf_chip {
    min-height: 30px;
    padding: 6px 13px;
    border-radius: 6px;
    background-color: var(--bf-dark-gray);
    color: var(--bf-white);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0.03em;
}
.bf_media {
    flex: 1;
    min-width: 200px;
    position: relative;
}
.bf_media::before {
    content: '';
    position: absolute;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    background-color: rgba(255, 165, 0, 0.18);
    pointer-events: none;
}
.bf_illustration {
    width: min(300px, 68vw);
    height: auto;
}
.bf_line {
    fill: none;
    stroke: var(--bf-black);
    stroke-width: 1.35;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bf_line_frame {
    stroke-width: 1.65;
}
.bf_line_accent {
    stroke: var(--bf-orange);
}
.bf_line_soft {
    stroke: rgba(0, 0, 0, 0.28);
    stroke-width: 1;
}
.bf_section_white {
    background-color: var(--bf-light-gray);
}
.bf_section_title {
    margin-bottom: 26px;
    padding-bottom: 12px;
    color: var(--bf-black);
    font-size: 26px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid var(--bf-orange);
}
.bf_grid {
    display: grid;
    gap: 16px;
}
.bf_grid_3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.bf_grid_footer {
    grid-template-columns: 1.35fr 1fr 1fr;
    gap: 32px;
}
.bf_card {
    min-height: 190px;
    padding: 24px;
    border: 1px solid var(--bf-border);
    border-top: 2px solid var(--bf-orange);
    border-radius: 6px;
    background-color: var(--bf-white);
    overflow: hidden;
}
.bf_icon_wrap {
    width: 52px;
    height: 52px;
    border-radius: 6px;
    background-color: var(--bf-gray);
    border: 1px solid rgba(255, 165, 0, 0.45);
    margin-bottom: 16px;
    flex-shrink: 0;
}
.bf_ui_icon {
    width: 26px;
    height: 26px;
    margin: 0;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bf_ui_icon path,
.bf_ui_icon circle,
.bf_ui_icon line,
.bf_ui_icon rect {
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bf_card h2 {
    margin: 0 0 8px;
    color: var(--bf-black);
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0.01em;
}
.bf_card p {
    margin: 0;
    color: var(--bf-muted);
    font-size: 13px;
    line-height: 1.6;
}
.bf_section_warm {
    background-color: var(--bf-dark-gray);
    border-top: 1px solid var(--bf-orange);
    color: var(--bf-white);
}
.bf_section_warm p {
    margin: 0 0 8px;
    color: #eeeeee;
    font-size: 14px;
    line-height: 1.6;
}
.bf_heading_icon {
    gap: 12px;
    margin-bottom: 6px;
    color: var(--bf-white);
    font-size: 18px;
    font-weight: 900;
}
.bf_ui_icon_accent,
.bf_heading_icon .bf_ui_icon_accent {
    stroke: var(--bf-orange);
}
.bf_link_row {
    gap: 12px;
    margin-top: 8px;
}
.bf_ui_icon_sm {
    width: 28px;
    height: 28px;
    margin: 0;
    stroke: var(--bf-orange);
}
.bf_section_copyright {
    padding-top: 16px;
    padding-bottom: 16px;
    background-color: var(--bf-black);
    color: #d4d4d4;
    font-size: 13px;
}

@media (max-width: 980px) {
    .bf_section_hero {
        flex-direction: column;
        align-items: flex-start;
        min-height: auto;
        background: var(--bf-white);
    }
    .bf_col_wide {
        width: 100%;
    }
    .bf_display {
        font-size: clamp(34px, 7vw, 50px);
    }
    .bf_grid_3,
    .bf_grid_footer {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 820px) {
    .bf_page .bf_links,
    .bf_page .bf_links.k_dipflx {
        display: none;
    }
}

@media (max-width: 620px) {
    .bf_section,
    .bf_bar {
        padding-left: 18px;
        padding-right: 18px;
    }
    .bf_display {
        font-size: 32px;
    }
    .bf_lead {
        font-size: 15px;
    }
    .bf_grid_3,
    .bf_grid_footer {
        grid-template-columns: 1fr;
    }
}
/* Miscellaneous Sizes */
.k_80xa {
    width: 80px;
    height: auto;
}
.k_120x50 {
    width: 120px;
    height: 50px;
}
.k_inlblock {
    display: inline-block;
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */

/* Font Families */
.k_font1 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.8rem;
}
.tt_font2, .tt_txt2, .tt_listah {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}
.tt_font3 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
}

/* Font Sizes - Fixed */
.k_txt10, .tt_f10 { font-size: 10px; }
.tt_f11 { font-size: 11px; }
.tt_f12 { font-size: 12px; }
.tt_f13 { font-size: 13px; }
.tt_f14 { font-size: 14px; }
.tt_f16 { font-size: 16px; }
.tt_txt1, .tt_f18 { font-size: 18px; }
.tt_f20 { font-size: 20px; }
.k_txt24 { font-size: 24px; }
.tt_f28 { font-size: 28px; }
.tt_f48 { font-size: 48px; }

/* Font Sizes - Responsive */
.k_f6vw { font-size: 6vw; }
.k_f8vw { font-size: 8vw; }
.k_f5vw { font-size: 5vw; }
.k_f4vw { font-size: 4vw; }
.k_f3vw { font-size: 3vw; }
.k_f1vw { font-size: clamp(12px, 1vw, 14px); }
.k_f1p3vw { font-size: 1.3vw; }
.k_f1p4vw { font-size: 1.4vw; }
.k_f1p6vw { font-size: 1.6vw; }
.k_f1p8vw { font-size: clamp(18px, 1.8vw, 20px); }
.k_f2vw { font-size: clamp(18px, 2vw, 28px); }
.k_f75p { font-size: 75%; }

/* Font Weight */
.k_bold, .k_ftitle {
    font-weight: bold;
}
.k_ftitle {
    font-size: 1.4rem;
}

/* Line Height */
.k_lnh10p { line-height: 10%; }
.k_lnh18 { line-height: 18px; }
.k_lnh20 { line-height: 20px; }
.k_lnh24 { line-height: 24px; }
.k_lnh30 { line-height: 30px; }
.k_lnh44 { line-height: 44px; }
.k_lnh50 { line-height: 50px; }
.k_lnh100 { line-height: 100px; }
.k_lnh100p { line-height: 100%; }
.k_lnh200 { line-height: 200px; }
.k_lnh300 { line-height: 300px; }
.k_lnh1vw { line-height: 1vw; }
.k_lnh1p5vw { line-height: 1.5vw; }
.k_lnh2vw { line-height: 2vw; }
.k_lnh6mm { line-height: 6mm; }
.k_lnh8mm { line-height: 8mm; }

/* Text Alignment */
.txt_c, .k_tac { text-align: center; }
.k_tal { text-align: left; }
.k_tar { text-align: right; }
.k_taj { text-align: justify; }


/* ============================================================
   ICONS & BUTTONS
   ============================================================ */

/* Icons */
.k_icon1 {
    width: 2.4vw;
    aspect-ratio: 1/1;
    float: left;
    margin: 3px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.k_icon2 {
    width: 1.5vw;
    aspect-ratio: 1/1;
    float: right;
    padding: 5px;
    border-radius: 0.75vw;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    justify-content: center;
}
.k_iconwa {
    width: auto;
    height: 46px;
    overflow: hidden;
    color: white;
    cursor: pointer;
    stroke: white;
}
.k_icon25p {
    width: 25%;
    aspect-ratio: 1/1; 
}
.k_icon50p {
    width: 50%;
    aspect-ratio: 1/1; 
}
.tt_icon50 {
    width: 50px;
    height: 50px;
    cursor: pointer;
}
.tt_icon70 {
    width: 70px;
    height: 70px;
    cursor: pointer;
}
.tt_canvas1 {
    width: 50%;
    height: auto;
    float: left;
}
.tt_img1 {
    width: 100%;
}

/* SVG Strokes & Fills */
.k_stroke1 { stroke: black; }
.k_stroke2 { stroke: orange; }
.k_svgfill1 { fill: #025852; }
.k_svgfill2 { fill: #ffffff; }

/* Inputs */
.k_in1 {
    height: 2vw;
    width: auto;
    margin: 0.5vw;
}

/* Buttons */
.k_btn1 {
    height: 2vw;
    line-height: 2vw;
    text-align: center;
    border-radius: 3px;
    background-color: #b99955;
    cursor: pointer;
    color: #fff;
}

/* Cursor */
.k_hand {
    cursor: pointer;
}

/* ============================================================
   TABS
   ============================================================ */
/* Shared tab base */
.k_tab0, .k_tab1 {
    width: 10vw;
    height: 2.5vw;
    float: left;
    border-radius: 0 0.5vw 0 0;
    overflow: hidden;
    padding: 0.5vw;
    margin: 0.5vw 0.25vw;
    cursor: pointer;
}
.k_tab0 {
    background-color: #fdfaf5;
}
.k_tab1 {
    background-color: #c6b9a0;
}

/* ============================================================
   COLORS
   ============================================================ */

/* Background Colors */
.k_bg1 { background-color: #fff5e6; }
.k_bg2 { background-color: #fffbf5; }
.k_bg3, .k_bg8 { background-color: #ffa500; }
.k_bg4 { background-color: #b99955; }
.k_bg5 { background-color: black; }
.k_bg6 { background-color: #ffe5cc; }
.k_bg7 { background-color: #444; }
.k_bg9 { background-color: #7d6938; }
.k_bg10 { background-color: #fef9f5; }
.k_bg11 { background-color: #ffb733; }
.k_bg12 { background-color: #f1f1f1; }
.k_bg13 { background-color: #4CAF50; }
.k_bg14 { background-color: #2196F3; }
.k_bg15 { background-color: #e8f0fe; }
.k_bg16 { background-color: #9fb3e7; }

/* Gradient Backgrounds */
.k_grad1 {
    background: linear-gradient(to bottom, orange, white, #7d6938, #000000);
}
.k_grad2, .k_grad3 {
    background: linear-gradient(to top, white, white, #616161);
}

/* Foreground Colors */
.k_fcolor1 { color: black; }
.k_fcolor2 { color: #ffffff; }
.k_fcolor3 { color: #fff5e6; }
.k_fcolor4 { color: #fff; }
.k_fcolor5 { color: #000000; }
.k_fcrre { color: #000000; }
.k_txtgray { color: #888; }

/* ============================================================
   BORDERS
   ============================================================ */

/* Border Styles */
.k_brdr1 { border: solid #ffa500 1px; }
.k_brdr2 { border: solid orange 1px; }
.k_brdr5 { border: solid #025852 1px; }
.k_brdr_gry { border: solid #ccc 1px; }

/* Border Sides */
.k_brdrb1 { border-bottom: solid #d3dddc 1px; }
.k_brdrb2 { border-bottom: solid orange 2px; }
.k_brdrb3 { border-bottom: solid #000 1px; }
.k_brdrbm1 { border-bottom: solid #f0f0e7 1px; }
.k_brdrt1 { border-top: solid #97bad4 1px; }
.k_brdrrt1 { border-right: solid #fff 1px; }
.k_brdrlt1 { border-left: solid #fff 1px; }
.k_brdrlt2 { border-left: solid #ffa500 1px; }
.k_brdrrt2 { border-right: solid #ffa500 1px; }

/* Border Radius - Fixed */
.k_brdrr2 { border-radius: 2px; }
.k_brdrr3 { border-radius: 3px; }
.k_brdrr5, .k_brdrr8 { border-radius: 5px; }
.k_brdrr7 { border-radius: 7px; }
.k_brdrr15 { border-radius: 15px; }
.k_brdrr25 { border-radius: 25px; }
.k_brdrr35 { border-radius: 35px; }
.k_brdrr50 { border-radius: 50px; }
.k_brdrr100 { border-radius: 100px; }

/* Border Radius - Responsive */
.k_brdrr0p75vw { border-radius: 0.75vw; }
.k_brdrr1vw { border-radius: 1vw; }
.k_brdrr2vw { border-radius: 2vw; }
.k_brdrr20vw { border-radius: 20vw; }

/* Border Radius - Specific Corners */
.k_brdrrs1 { border-radius: 0 0 0.5vw 0; }
.k_brdrrs2 { border-radius: 0 0 0 0.5vw; }
.k_brdrrs3 { border-radius: 0 0.5vw 0 0; }
.k_brdrrs4 { border-radius: 0.5vw 0 0 0; }
.k_brdrrs5 { border-radius: 0.5vw 0.5vw 0 0; }
.k_brdrrs7 { border-radius: 3vw 3vw 0 0; }


/* ============================================================
   SPACING - PADDING
   ============================================================ */

/* Padding - Fixed (px) */
.k_pad1 { padding: 1px; }
.k_pad2 { padding: 2px; }
.k_pad3 { padding: 3px; }
.k_pad4 { padding: 4px; }
.k_pad5 { padding: 5px; }
.k_pad8 { padding: 8px; }
.k_pad10 { padding: 10px; }
.k_pad15 { padding: 15px; }
.k_pad16 { padding: 16px; }
.k_pad20 { padding: 20px; }
.k_pad40 { padding: 40px; }

/* Padding - Multi-value */
.k_pad40_20 { padding: 40px 2px; }
.k_pad5_20 { padding: 5px 20px; }
.k_pada4 { padding: 25mm 20mm 20mm 20mm; }
.k_pada4min { padding: 8mm 8mm 8mm 8mm; }
.k_padt1mm { padding-top: 1mm; }
.k_pad1mm { padding: 1mm; }

/* Padding - Responsive (vw) */
.k_pad0p3vw { padding: 0.3vw; }
.k_pad0p5vw, .k_pad05vw { padding: 0.5vw; }
.k_pad1vw { padding: 1vw; }
.k_pad1p2vw { padding: 1.2vw; }
.k_pad2vw { padding: 2vw; }
.k_pad2p5vw { padding: 2.5vw; }
.k_pad3vw { padding: 3vw; }
.k_pad4vw { padding: 4vw; }
.k_pad5vw { padding: 5vw; }
.k_pad5p10p { padding: 5vw 10vw; }
/* Padding - Percentage */
.k_pad1p { padding: 1%; }
.k_pad2p { padding: 2%; }
.k_pad3p { padding: 3%; }
.k_pad4p { padding: 4%; }
.k_pad5p { padding: 5%; }

/* Padding - Specific Sides */
.k_padt4p { padding-top: 4%; }

/* ============================================================
   SPACING - MARGINS
   ============================================================ */
.k_ma { margin: auto; }
.k_ma1 { margin: 1px; }
.k_m3 { margin: 3px; }
.k_m5 { margin: 5px; }
.k_m10 { margin: 10px; }
.k_m0p2p { margin: 0 2%; }
.k_m5_10 { margin: 5px 10px; }
.k_m10_10_5_10 { margin: 15px 10px 5px 10px; }

/* Margin - Specific Sides */
.k_mal5 { margin-left: 5px; }
.k_mgnl10 { margin-left: 10px; }
.k_mt0p5vw { margin-top: 0.5vw; }
.k_mt1vw { margin-top: 1vw; }

/* ============================================================
   DIMENSIONS - WIDTH
   ============================================================ */

/* Width - Layout Parts */
.tt_2part { width: 100%; }
.tt_3part { width: 100%; }
.tt_4part { width: 50%; }

/* Width - Responsive (vw) */
.w_0p5vw { width: 0.5vw; }
.w_0p8vw { width: 0.8vw; }
.w_1vw { width: 1vw; }
.w_1p2vw { width: 1.2vw; }
.w_1p5vw { width: 1.5vw; }
.w_2vw { width: 2vw; }
.w_2p5vw { width: 2.5vw; }
.w_3vw { width: 3vw; }
.w_5vw { width: 5vw; }
.w_6vw { width: 6vw; }
.w_8vw { width: 8vw; }
.w_10vw { width: 10vw; }
.w_15vw { width: 15vw; }
.w_20vw { width: 20vw; }
.w_25vw { width: 25vw; }
.w_30vw { width: 30vw; }
.w_40vw { width: 40vw; }
.w_47vw { width: 47vw; }
.w_50vw { width: 45vw; }

/* Width - Percentage */
.w_100p { width: 100%; }
.w_99p { width: 99%; }
.w_95p { width: 95%; }
.w_90p { width: 90%; }
.w_85p { width: 85%; }
.w_80p { width: 80%; }
.w_71p { width: 71%; }
.w_70p { width: 70%; }
.w_66p { width: 66%; }
.w_65p { width: 65%; }
.w_60p { width: 60%; }
.w_50p, .w50p { width: 50%; }
.w_49p { width: 49%; }
.w_48p { width: 48%; }
.w_47p { width: 47%; }
.w_46p { width: 46%; }
.w_44p { width: 44%; }
.w_45p { width: 45%; }
.w_40p { width: 40%; }
.w_39p { width: 39%; }
.w_35p { width: 35%; }
.w_34p { width: 34%; }
.w_33p { width: 33%; }
.w_30p5p { width: 30.5%; }
.w_30p { width: 30%; }
.w_25p, .w25p { width: 25%; }
.w_20p { width: 20%; }
.w_15p { width: 15%; }
.w_10p { width: 10%; }
.w_5p { width: 5%; }
.w_4p { width: 4%; }
.w_3p { width: 3%; }

/* Width - Fixed (px) */
.w_200 { width: 200px; }
.w_150 { width: 150px; }
.w_100 { width: 100px; }
.w_70 { width: 70px; }
.w_60 { width: 60px; }
.w_50 { width: 50px; }
.w_40 { width: 40px; }
.w_30 { width: 30px; }
.w_auto { width: auto; }

/* Width - Print (mm) */
.w_40mm { width: 40mm; }
.w_60mm {width: 60mm;}


/* Width - Calculated & Min/Max */
.w_100pm3p5vw { width: calc(100% - 3.5vw); }
.w_min100p { min-width: 100%; }

/* ============================================================
   DIMENSIONS - HEIGHT
   ============================================================ */

/* Height - Aspect Ratios */
.h_1t1 { aspect-ratio: 1/1; }
.h_1t2 { aspect-ratio: 1/2; }
.h_4t5 { aspect-ratio: 4/5; }
.h_2t1 { aspect-ratio: 2/1; }
.h_3t1 { aspect-ratio: 3/1; }
.h_3t2 { aspect-ratio: 3/2; }
.h_4t1 { aspect-ratio: 4/1; }
.h_5t1 { aspect-ratio: 5/1; }
.h_6t1 { aspect-ratio: 6/1; }
.h_7t1 { aspect-ratio: 7/1; }
.h_8t1 { aspect-ratio: 8/1; }
.h_10t1 { aspect-ratio: 10/1; }
.h_20t1 { aspect-ratio: 20/1; }
.h_25t1 { aspect-ratio: 25/1; }

/* Height - Percentage */
.h_100p { height: 100%; }
.h_90p { height: 90%; }
.h_85p { height: 85%; }
.h_80p { height: 80%; }
.h_78p { height: 78%; }
.h_75p { height: 75%; }
.h_74p { height: 74%; }
.h_73p { height: 73%; }
.h_72p { height: 72%; }
.h_70p { height: 70%; }
.h_60p { height: 60%; }
.h_65p { height: 65%; }
.h_50p { height: 50%; }
.h_35p { height: 35%; }
.h_30p { height: 30%; }
.h_20p { height: 20%; }
.h_15p { height: 15%; }
.h_10p { height: 10%; }
.h_8p { height: 8%; }
.h_5p { height: 5%; }
.h_3p { height: 3%; }
.h_2p { height: 2%; }
.h_1p { height: 1%; }

/* Height - Fixed (px) */
.h_300 { height: 300px; }
.h_200 { height: 200px; }
.h_120 { height: 120px; }
.h_100 { height: 100px; }
.h_80 { height: 80px; }
.h_75 { height: 75px; }
.h_70 { height: 70px; }
.h_50 { height: 50px; }
.h_45 { height: 45px; }
.h_40 { height: 40px; }
.h_30 { height: 30px; }
.h_26 { height: 26px; }
.h_25 { height: 25px; }
.h_20 { height: 20px; }
.h_0 { height: 0px; }
.h_auto { height: auto; }

/* Height - Responsive (vw) */
.h_0p5vw { height: 0.5vw; }
.h_1vw { height: 1vw; }
.h_2vw { height: 2vw; }
.h_2p5vw { height: 2.5vw; }
.h_3vw { height: 3vw; }
.h_4vw { height: 4vw; }
.h_10vw { height: 10vw; }
.h_25vw { height: 25vw; }
.h_30vw { height: 30vw; }
.h_50ph { height: 50vw; }
.h_80ph { height: 80vw; }
.h_100ph { height: 100vw; }

/* Height - Print (mm) */
.h_297mm { height: 297mm; }
.h_277mm {height: 277mm;}
.h_170mm {height: 170mm;}
.h_160mm {height: 160mm;}
.h_140mm { height: 140mm; }
.h_50mm { height: 50mm; }
.h_40mm {height: 40mm;}
.h_30mm { height: 30mm; }
.h_20mm { height: 20mm; }
.h_10mm {height: 10mm;}
.h_5mm { height: 5mm; }
.h_6mm { height: 6mm; }
.h_7mm { height: 7mm; }
.h_8mm { height: 8mm; }

/* Height - Calculated & Min/Max */
.h_100pm3vw { height: calc(100% - 3vw); }
.h_100pl6vw { height: calc(100% - 6vw); }
.h_min2t1 { min-height: 0.5vw; }
.h_max1000 { max-height: 1000px; }

/* ============================================================
   POSITIONING
   ============================================================ */

/* Position Types */
.k_posa { position: absolute; }
.k_posr { position: relative; }
.k_posfx { position: fixed; }

/* Position Values */
.k_top0 { top: 0px; }
.k_left0 { left: 0px; }
.k_top50p { top: 50%; }
.k_lft50p { left: 50%; }
.k_btm20 { bottom: 20px; }
.k_btm40 { bottom: 40px; }
.k_btm50 { bottom: 50px; }

/* Transform Centering */
.k_vhc, .k_vhc2 { 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    -ms-transform: translate(-50%, -50%); 
}
.k_vc { 
    -ms-transform: translateY(-50%); 
    transform: translateY(-50%); 
}
.k_hc { 
    -ms-transform: translateX(-50%); 
    transform: translateX(-50%); 
}

/* Float & Flexbox Alignment */
.k_floatl { float: left; }
.k_floatr { float: right; }
.k_justc { justify-content: center; }
.k_aic { align-items: center; }


/* ============================================================
   DISPLAY PROPERTIES
   ============================================================ */

/* Display Types */
.tt_bk { display: block; }
.k_dipflx { display: flex; }
.k_dispifx { display: inline-flex; }
.k_diptbc { display: table-cell; }
.k_dispbl { display: inline-block; }
.k_dispn { display: none; }

/* Overflow */
.k_ofa { overflow: auto; }
.ovf_h { overflow: hidden; }
.ovf_s { overflow: scroll; }
.ovf_v { overflow: visible; }
.k_scrolly { overflow-y: scroll; }
.ovf_dots { text-overflow: ellipsis; }

/* Hide Scrollbar */
.k_scrollnb {
    &::-webkit-scrollbar {
        display: none;
    }
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Whitespace & Fit */
.k_nowrap { white-space: nowrap; }
.k_prewrap { white-space: pre-wrap; }
.k_fit { object-fit: cover; }
.k_lofixed { table-layout: fixed; }
.k_wdbrk { word-break: break-all; }

/* ============================================================
   Z-INDEX
   ============================================================ */
.kz_1 { z-index: 1; }
.kz_2 { z-index: 2; }
.kz_3 { z-index: 3; }
.kz_4 { z-index: 4; }
.kz_10 { z-index: 10; }

/* ============================================================
   TABLES
   ============================================================ */
.k_th { 
    background-color: #ccb78f; 
    font-weight: bold; 
}
.k_tr0 { background-color: #f1f1f1; }
.k_tr1 { background-color: #ffffff; }
.k_td { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 0.85vw; 
    white-space: nowrap; 
    padding: 0.3vw; 
}

/* ============================================================
   HOVER EFFECTS
   ============================================================ */
.k_hov1:hover { stroke: #886c3c; }
.k_hov2:hover { background-color: #ede1c9; }
.k_hov3:hover { background-color: #fcf2da; }
.k_hov4:hover { background-color: #d4cbcb; }

/* ============================================================
   LIST STYLES
   ============================================================ */
.k_nodot {
    list-style-type: none;
}
.k_ulsq li::marker {
    list-style-type: circle;
    font-size: 30px;
}

/* ============================================================
   BOX EFFECTS
   ============================================================ */

/* Shadows */
.k_shadow1 {
    box-shadow: 0px 0px 10px 1px #000000;
}

/* Flyout/Suggestion Box */
.k_flyout1 {
    display: none;
    position: absolute;
    left: 220px;
    top: 220px;
    width: auto;
    max-width: 25vw;
    max-height: 70vh;
    overflow: hidden;
    padding: 0.5vw;
    background-color: #ffffff;
    z-index: 202;
    box-shadow: 0px 0px 3px 1px #9f9f9f;
}

/* Transitions */
.k_smooth1 {
    transition: width 2s ease, height 2s ease;
}
.k_trans1 {
    transition: all 1s ease-in-out;
}
.k_trans2 {
    transition: all 2s ease-in-out;
}

/* ============================================================
   PRINT STYLES
   ============================================================ */
.a4p {
    width: 210mm;
    height: 297mm;
}

/*begining of template 1 css */
.bf_icon {
    width: 100%;
    aspect-ratio: 1 / 1;
    cursor: pointer;
    overflow: hidden;
}

/* Shared full-width float-left base */
.bf_canvas, .bf_rack, .vc_0, .vc_3, .vc_0b_0b_0, .vc_0b_0b_1, .vc_0b_0c, .bpf, .ph {
    width: 100%;
    float: left;
}
.bf_canvas {
    height: auto;
    border-bottom: solid #c1c1c1 1px;
    padding: 5px;
}
.bf_rack {
    height: auto;
}
.bf_title {
    width: 100%;
    aspect-ratio: 8 / 1;
    overflow: hidden;
    display: flex;
    align-items: center;
    font-size: clamp(12px, 2.6vw, 20px);
    font-weight: bold;
    padding: 30px 10px;
}
.bf_txtbx1 {
    width: 90%;
    aspect-ratio: 15 / 1;
    display: flex;
    align-items: center;
    border: solid gray 1px;
    margin: 10px;
}
.bf_btn1 {
    width: 30%;
    aspect-ratio: 4 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
    border: solid gray 1px;
    border-radius: 3px;
    background-color: #000c1e;
    margin: 10px;
    text-align: center;
    cursor: pointer;
    color: #ffa500;
}
.vc_0 {
    height: auto;
    background-color: #dfdfdd;
}
.vc_0a {
    width: 100%;
    aspect-ratio: 2 / 1;
    float: left;
}
.vc_0a_0 {
    position: relative;
    width: 50%;
    aspect-ratio: 1 / 1;
    left: 25%;
    top: 50%;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
    border-radius: 7px;
}
.vc_0b {
    width: 100%;
    aspect-ratio: 1.6 / 1;
    padding-top: 30%;
    text-align: center;
    float: left;
    line-height: clamp(7vw, 40px, 60px);
    font-size: clamp(14px, 2vw, 14px);
    font-weight: bold;
}
.vc_0b_0 {
    width: 100%;
    aspect-ratio: 3 / 2;
    padding: 5%;
    overflow: hidden;
}
.vc_0b_0a {
    width: 30%;
    aspect-ratio: 1 / 1;
    float: left;
    overflow: hidden;
    border-radius: 50%;
}
.vc_0d_0a0 {
    width: 100%;
    height: auto;
}
.vc_0b_0b {
    width: 70%;
    float: left;
    overflow: hidden;
    padding: 2%;
}
.vc_0b_0b_0 {
    height: auto;
    text-align: left;
    line-height: 10vw;
    font-size: 10vw;
}
.vc_0b_0b_1 {
    height: auto;
    text-align: left;
    line-height: 4vw;
    padding: 1%;
    font-size: 4vw;
    color: #000c1e;
}
.vc_0b_0c {
    height: auto;
    line-height: 20vw;
    text-align: center;
    overflow: hidden;
    font-size: 8vw;
    text-decoration: underline;
}
.vc_3 {
    height: auto;
    padding: 2vw;
    background-color: #fafafa;
}
.vc_3a {
    width: 50%;
    aspect-ratio: 1 / 1;
    overflow-y: visible;
    float: left;
}
.vc_3a_0 {
    position: relative;
    left: 25%;
    width: 50%;
    height: 50%;
    padding: 5%;
}
.vc_3a_1 {
    float: left;
    width: 100%;
    height: 30%;
    text-align: center;
    padding: 5%;
    font-size: clamp(12px, 3.6vw, 14px);
}
.r1_c1, .r1_c2, .r2_c1, .r2_c2 {
    border-bottom: solid #c1c1c1 1px;
}
.r1_c1, .r2_c1, .r3_c1 {
    border-right: solid #c1c1c1 1px;
}
.som {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    width: 100%;
    height: auto;
    float: left;
    padding: 4vw;
    border-bottom: solid #c1c1c1 1px;
}
.som_1 {
    width: 16%;
    aspect-ratio: 1 / 1;
    padding: 2%;
}
.bpf {
    box-sizing: border-box;
    height: auto;
    padding: 2vw;
    border-bottom: solid #c1c1c1 1px;
    font-size: clamp(12px, 2.6vw, 20px);
}
.ph {
    height: 120px;
}
/*end of template css*/


/* ============================================================
   RESPONSIVE BREAKPOINTS
   ============================================================ */

/* Mobile Default (< 820px) */
.s_100t50p { width: 100%; }

/* Tablet (820px - 1200px) */
@media (min-width: 820px) and (max-width: 1200px) {
    .s_100t50p { width: 100%; }
}

/* Desktop (>= 1200px) */
@media (min-width: 1200px) {
    .s_100t50p { width: 50%; }
    #ttlogin { padding: 10vw; }
    #kboth { padding: 5vw; }
    
    /* Login form specific fixes */
    .tt_f20 { font-size: 18px; }
    .txt_c { padding: 8px 12px; }
    
    
}

/* ============================================================
   UTILITY CLASSES
   ============================================================ */
.k_txtgray {
    color: #888;
}

.k_link {
    color: #007bff;
    text-decoration: underline;
    margin-left: 1vw;
}

.k_link:hover {
    color: #0056b3;
}

/* ============================================================
   CRM SPECIFIC STYLES
   ============================================================ */

/* Search Input Box - Orange theme border */
.crm_input_box {
    border: 2px solid #ffa500;
    border-radius: 8px;
    transition: border-color 0.3s;
}

.crm_input_box:hover {
    border-color: #ff8c00;
}

.crm_input_box:focus-within {
    border-color: #ff8c00;
}

/* Spacing Utilities */
.k_mt5 { margin-top: 5px; }
.k_mt8 { margin-top: 8px; }
.k_mt10 { margin-top: 10px; }
.k_mt15 { margin-top: 15px; }
.k_mt20 { margin-top: 20px; }
.k_mt30 { margin-top: 30px; }
.k_mb5 { margin-bottom: 5px; }
.k_mb8 { margin-bottom: 8px; }
.k_mb10 { margin-bottom: 10px; }
.k_mb15 { margin-bottom: 15px; }
.k_mb20 { margin-bottom: 20px; }
.k_mb30 { margin-bottom: 30px; }


    
/* ============================================================
   CHART STYLES
   ============================================================ */

.k_color0 { fill: #ff6b6b; }
.k_color1 { fill: #ffd166; }
.k_color2 { fill: #06d6a0; }
.k_color3 { fill: #118ab2; }

.k_histo_value {
    font-size: inherit;        /* IMPORTANT */
    fill: currentColor;        /* inherits font color */
}

/* ============================================================
   DRAWER COMPONENT
   ============================================================ */
.k_drawer1 {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 0;
    background-color: #ffffff;
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.3);
    z-index: 1000;
    overflow: hidden;
    transition: width 0.3s ease-in-out;
    display: none;
}

/* ============================================================
   BUSINESS-FOLIO AI ASSISTANT
   ============================================================ */
.bf_ai_plugin_trigger {
    cursor: pointer;
}

.bf_review_plugin_trigger {
    cursor: pointer;
}

.bf_pub_plugin_trigger {
    cursor: pointer;
}

.bf_srv_plugin_trigger {
    cursor: pointer;
}

.bf_ai_page {
    --bf-orange: orange;
    --bf-black: #000000;
    --bf-gray: #d4d4d4;
    --bf-dark-gray: #5a5a5a;
    min-height: 100vh;
    background: #f6f8fb;
    padding: 18px;
    box-sizing: border-box;
}

.bf_ai_panel {
    width: min(620px, 100%);
    height: calc(100vh - 36px);
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e9f1;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(0, 12, 30, 0.08);
}

.bf_ai_top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: var(--bf-gray);
    color: var(--bf-black);
    border-bottom: 1px solid var(--bf-orange);
}

.bf_ai_chip {
    border: 0;
    cursor: pointer;
    font: inherit;
}

.bf_ai_top .bf_logo polygon:nth-child(1),
.bf_ai_top .bf_logo polygon:nth-child(3) {
    fill: var(--bf-orange);
    stroke: var(--bf-orange);
}

.bf_ai_top .bf_logo polygon:nth-child(2) {
    fill: var(--bf-black);
    stroke: var(--bf-black);
}

.bf_ai_logo {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
}

.bf_ai_title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.bf_ai_subtitle {
    font-size: 12px;
    color: var(--bf-dark-gray);
    line-height: 1.35;
}

.bf_ai_log {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bf_ai_log .k_chatline {
    padding: 5px 0;
}

.bf_ai_log .k_sysbot,
.bf_ai_log .k_userbot {
    font-size: 14px;
    line-height: 1.45;
}

.bf_ai_quick {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 14px 12px;
}

.bf_ai_chip {
    white-space: nowrap;
    border-radius: 999px;
    background: #fff7dc;
    color: #000c1e;
    padding: 8px 10px;
    font-size: 12px;
}

.bf_ai_entry {
    display: flex;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid #e5e9f1;
    background: #ffffff;
}

.bf_ai_textbox {
    flex: 1;
    min-width: 0;
    height: 54px;
}

.bf_ai_textbox textarea {
    border: 1px solid #cfd8e5;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 14px;
    resize: none;
}

.bf_ai_send_btn {
    width: 54px;
    height: 54px;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 8px;
}

.bf_ai_send_btn svg {
    width: 100%;
    height: 100%;
}

@media (max-width: 640px) {
    .bf_ai_page {
        padding: 0;
    }

    .bf_ai_panel {
        height: 100vh;
        border: 0;
        border-radius: 0;
    }
}

/* ============================================================
   BUSINESS-FOLIO GOOGLE REVIEW
   ============================================================ */
.bf_review_page {
    --bf-orange: orange;
    --bf-black: #000000;
    --bf-gray: #d4d4d4;
    --bf-dark-gray: #5a5a5a;
    min-height: 100vh;
    background: #f6f8fb;
    padding: 18px;
    box-sizing: border-box;
}

.bf_review_panel {
    width: min(520px, 100%);
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e9f1;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(0, 12, 30, 0.08);
}

.bf_review_top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: var(--bf-gray);
    color: var(--bf-black);
    border-bottom: 1px solid var(--bf-orange);
}

.bf_review_top .bf_logo polygon:nth-child(1),
.bf_review_top .bf_logo polygon:nth-child(3) {
    fill: var(--bf-orange);
    stroke: var(--bf-orange);
}

.bf_review_top .bf_logo polygon:nth-child(2) {
    fill: var(--bf-black);
    stroke: var(--bf-black);
}

.bf_review_logo {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
}

.bf_review_title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.bf_review_subtitle {
    font-size: 12px;
    color: var(--bf-dark-gray);
    line-height: 1.35;
}

.bf_review_body {
    padding: 22px;
    text-align: center;
}

.bf_review_stars {
    font-size: 28px;
    line-height: 1.4;
}

.bf_review_copy {
    margin: 12px auto 18px;
    max-width: 360px;
    color: #4a5568;
    font-size: 14px;
    line-height: 1.45;
}

.bf_review_btn {
    border: 0;
    border-radius: 10px;
    background: #000000;
    color: #ffffff;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    padding: 12px 18px;
}

.bf_review_list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 16px 0;
    text-align: left;
}

.bf_review_item {
    border: 1px solid #e5e9f1;
    border-radius: 10px;
    padding: 12px;
    background: #ffffff;
}

.bf_review_item_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 13px;
}

.bf_review_item_text {
    margin-top: 8px;
    color: #2d3748;
    font-size: 14px;
    line-height: 1.45;
}

.bf_review_item_date,
.bf_pub_item_date {
    margin-top: 8px;
    color: #718096;
    font-size: 12px;
}

.bf_review_empty,
.bf_pub_empty {
    border: 1px dashed #cfd8e5;
    border-radius: 10px;
    color: #4a5568;
    font-size: 14px;
    line-height: 1.45;
    padding: 14px;
}

.bf_review_actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.bf_review_btn_light {
    background: #f6c344;
    color: #000000;
}

@media (max-width: 640px) {
    .bf_review_page {
        padding: 0;
    }

    .bf_review_panel {
        min-height: 100vh;
        border: 0;
        border-radius: 0;
    }
}

/* ============================================================
   BUSINESS-FOLIO PUBLICATIONS
   ============================================================ */
.bf_pub_page {
    --bf-orange: orange;
    --bf-black: #000000;
    --bf-gray: #d4d4d4;
    --bf-dark-gray: #5a5a5a;
    min-height: 100vh;
    background: #f6f8fb;
    padding: 18px;
    box-sizing: border-box;
}

.bf_pub_panel {
    width: min(620px, 100%);
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e9f1;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(0, 12, 30, 0.08);
}

.bf_pub_top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: var(--bf-gray);
    color: var(--bf-black);
    border-bottom: 1px solid var(--bf-orange);
}

.bf_pub_top .bf_logo polygon:nth-child(1),
.bf_pub_top .bf_logo polygon:nth-child(3) {
    fill: var(--bf-orange);
    stroke: var(--bf-orange);
}

.bf_pub_top .bf_logo polygon:nth-child(2) {
    fill: var(--bf-black);
    stroke: var(--bf-black);
}

.bf_pub_logo {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
}

.bf_pub_title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.bf_pub_subtitle {
    font-size: 12px;
    color: var(--bf-dark-gray);
    line-height: 1.35;
}

.bf_pub_body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px;
}

.bf_pub_item {
    border: 1px solid #e5e9f1;
    border-radius: 10px;
    cursor: pointer;
    padding: 14px;
    background: #ffffff;
}

.bf_pub_item_title {
    color: #000000;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.bf_pub_item_summary {
    margin-top: 8px;
    color: #2d3748;
    font-size: 14px;
    line-height: 1.45;
}

.bf_pub_back {
    border: 0;
    border-radius: 8px;
    background: #000000;
    color: #ffffff;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    padding: 8px 10px;
}

.bf_pub_detail {
    padding: 18px;
}

.bf_pub_detail_text {
    color: #2d3748;
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 16px;
}

@media (max-width: 640px) {
    .bf_pub_page {
        padding: 0;
    }

    .bf_pub_panel {
        min-height: 100vh;
        border: 0;
        border-radius: 0;
    }
}

/* Business-Folio public website */
html{overflow:auto}.bfw_body{height:auto;min-height:100%;overflow:auto;margin:0;background:#f1f1f1;color:#000}.bfw_page{--bf-orange:orange;--bf-black:#000;--bf-white:#fff;--bf-gray:#d4d4d4;--bf-dark-gray:#5a5a5a;--bf-light-gray:#f1f1f1;--bf-ink:#141414;--bf-muted:#565656;--bf-border:#cfcfcf;width:100%;min-height:100vh;overflow-x:hidden;background:#f8f8f8;color:var(--bf-ink);font-family:Arial,Helvetica,sans-serif}.bfw_nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;min-height:76px;padding:14px clamp(18px,5vw,76px);background:rgba(255,255,255,.96);border-bottom:1px solid var(--bf-border)}.bfw_nav .bf_brand{text-decoration:none}.bfw_nav .bf_brand span{display:block}.bfw_links{margin-left:auto;display:flex;align-items:center;gap:28px}.bfw_links a{color:var(--bf-black);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.bfw_links a:hover{color:var(--bf-orange)}.bfw_hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.75fr);gap:clamp(28px,6vw,86px);align-items:center;padding:clamp(48px,8vw,104px) clamp(18px,5vw,76px);background:linear-gradient(110deg,#fff 0%,#fff 58%,#e9e9e9 58%,#e9e9e9 100%);border-bottom:1px solid var(--bf-border)}.bfw_hero_copy{max-width:820px}.bfw_h1{margin:12px 0 0;max-width:780px;color:var(--bf-black);font-size:clamp(40px,6.4vw,78px);line-height:.98;font-weight:900;letter-spacing:0}.bfw_lead{max-width:660px;margin:22px 0 0;color:var(--bf-muted);font-size:clamp(16px,1.5vw,21px);line-height:1.55}.bfw_hero_points{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}.bfw_hero_points span{padding:8px 13px;min-height:32px;border-radius:6px;background:var(--bf-dark-gray);color:var(--bf-white);font-size:12px;font-weight:900;letter-spacing:.03em}.bfw_hero_art{display:flex;align-items:center;justify-content:center}.bfw_hero_art svg{width:min(420px,82vw);height:auto}.bfw_svg_card,.bfw_svg_line,.bfw_svg_grid,.bfw_svg_soft,.bfw_svg_accent{fill:none;stroke-linecap:round;stroke-linejoin:round}.bfw_svg_card,.bfw_svg_line,.bfw_svg_grid{stroke:var(--bf-black)}.bfw_svg_card{stroke-width:1.8}.bfw_svg_line{stroke-width:1.35}.bfw_svg_grid{stroke-width:1.05}.bfw_svg_soft{stroke:rgba(0,0,0,.32);stroke-width:1}.bfw_svg_accent{stroke:var(--bf-orange);stroke-width:1.35}.bfw_section{padding:clamp(46px,6vw,82px) clamp(18px,5vw,76px);background:var(--bf-light-gray)}.bfw_section_head{max-width:820px;margin-bottom:28px}.bfw_section_head span{color:var(--bf-orange);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.14em}.bfw_section_head h2{margin:8px 0 0;color:var(--bf-black);font-size:clamp(26px,3.2vw,42px);line-height:1.08;font-weight:900;letter-spacing:0}.bfw_section_head p{max-width:760px;margin:12px 0 0;color:var(--bf-muted);font-size:15px;line-height:1.7}.bfw_grid{display:grid;gap:16px}.bfw_grid_3{grid-template-columns:repeat(3,minmax(0,1fr))}.bfw_card,.bfw_panel,.bfw_agent_list article{border:1px solid var(--bf-border);border-top:2px solid var(--bf-orange);border-radius:6px;background:#fff}.bfw_card{min-height:230px;padding:24px}.bfw_icon{display:flex;align-items:center;justify-content:center;width:54px;height:54px;margin-bottom:18px;border-radius:6px;background:var(--bf-gray);border:1px solid rgba(255,165,0,.45)}.bfw_icon svg{width:30px;height:30px;stroke-linecap:round;stroke-linejoin:round}.bfw_card h3,.bfw_panel h3{margin:0 0 9px;color:var(--bf-black);font-size:16px;font-weight:900}.bfw_card p,.bfw_panel p,.bfw_agent_list p{margin:0;color:var(--bf-muted);font-size:14px;line-height:1.65}.bfw_band{padding:clamp(46px,6vw,82px) clamp(18px,5vw,76px);background:var(--bf-dark-gray);border-top:1px solid var(--bf-orange);border-bottom:1px solid var(--bf-orange)}.bfw_section_head_dark h2{color:#fff}.bfw_section_head_dark p{color:#eee}.bfw_agent_list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.bfw_agent_list article{min-height:190px;padding:22px;background:#fff}.bfw_agent_list b{display:block;margin-bottom:8px;color:var(--bf-black);font-size:16px;font-weight:900}.bfw_split{display:grid;grid-template-columns:1fr 1fr;gap:16px}.bfw_panel{padding:26px}.bfw_steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.bfw_steps div{display:flex;flex-direction:column;gap:12px;min-height:150px;padding:20px;border-left:2px solid var(--bf-orange);background:#fff}.bfw_steps b{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:6px;background:var(--bf-orange);color:var(--bf-black);font-size:16px}.bfw_steps span{color:var(--bf-black);font-size:15px;line-height:1.45;font-weight:800}@media (max-width:1000px){.bfw_hero{grid-template-columns:1fr;background:#fff}.bfw_grid_3,.bfw_agent_list,.bfw_steps{grid-template-columns:1fr 1fr}}@media (max-width:760px){.bfw_links{display:none}.bfw_nav{min-height:68px}.bfw_h1{font-size:38px}.bfw_grid_3,.bfw_agent_list,.bfw_split,.bfw_steps{grid-template-columns:1fr}.bfw_card,.bfw_agent_list article,.bfw_panel{min-height:auto}}

.bfw_signup_section{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.72fr);gap:clamp(22px,5vw,66px);align-items:center;background:#fff;border-bottom:1px solid var(--bf-border)}.bfw_signup_copy span{color:var(--bf-orange);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.14em}.bfw_signup_copy h2{max-width:560px;margin:8px 0 0;color:var(--bf-black);font-size:clamp(28px,3.8vw,50px);line-height:1.05;font-weight:900;letter-spacing:0}.bfw_signup_copy p{max-width:610px;margin:16px 0 0;color:var(--bf-muted);font-size:16px;line-height:1.7}.bfw_signup_steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:22px}.bfw_signup_steps div{min-height:86px;padding:14px;border-left:2px solid var(--bf-orange);background:var(--bf-light-gray)}.bfw_signup_steps b{display:flex;align-items:center;justify-content:center;width:28px;height:28px;margin-bottom:9px;border-radius:5px;background:var(--bf-orange);color:var(--bf-black);font-size:13px}.bfw_signup_steps span{display:block;color:var(--bf-black);font-size:13px;font-weight:800;line-height:1.35}.bfw_signup{width:100%;max-width:520px;margin-left:auto;padding:20px;border:1px solid var(--bf-border);border-top:2px solid var(--bf-orange);border-radius:6px;background:#fff;box-shadow:0 18px 42px rgba(0,0,0,.07)}.bfw_signup_title{margin-bottom:10px;color:var(--bf-black);font-size:15px;font-weight:900}.bfw_signup_grid{display:grid;grid-template-columns:1fr;gap:8px}.bfw_signup input{width:100%;min-height:44px;border:1px solid var(--bf-border);border-radius:5px;padding:0 10px;box-sizing:border-box;color:var(--bf-black);font-size:14px;background:#fff}.bfw_signup button{min-height:44px;margin-top:10px;border:0;border-radius:5px;background:var(--bf-orange);color:var(--bf-black);font-size:13px;font-weight:900;cursor:pointer}.bfw_signup>button{width:100%}.bfw_verify{display:none;margin-top:12px;padding-top:12px;border-top:1px solid var(--bf-border)}.bfw_signup_note{margin-bottom:8px;color:var(--bf-muted);font-size:13px;line-height:1.45}.bfw_verify_actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.bfw_verify_actions button{background:var(--bf-black);color:#fff}.bfw_signup_msg{min-height:18px;margin-top:10px;font-size:13px;line-height:1.4}.bfw_signup_msg_ok{color:#155724}.bfw_signup_msg_err{color:#8a1f11}@media (max-width:900px){.bfw_signup_section{grid-template-columns:1fr}.bfw_signup{max-width:none;margin-left:0}.bfw_signup_steps{grid-template-columns:1fr 1fr 1fr}}@media (max-width:760px){.bfw_signup{padding:14px}.bfw_verify_actions,.bfw_signup_steps{grid-template-columns:1fr}}
/* =====================================================
   AMANAH GROCERY STOREFRONT
   ===================================================== */
.amanah_body {
    margin: 0;
    background: #f6f7f2;
    color: #17231d;
    font-family: Arial, Helvetica, sans-serif;
    overflow-x: hidden;
    overflow-y: auto;
}
.amanah_nav {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 68px;
    padding: 10px min(4vw, 28px);
    background: rgba(255,255,255,0.94);
    border-bottom: 1px solid #dde2d7;
}
.amanah_menu_btn {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 0;
    background: transparent;
    display: none;
    padding: 8px;
}
.amanah_menu_btn svg {
    width: 100%;
    height: 100%;
}
.amanah_menu_btn svg polygon {
    fill: #f5c542;
    stroke: #f5c542;
}
.amanah_menu_btn svg .amanah_logo_bottom {
    fill: #0f5b3f;
    stroke: #0f5b3f;
}
.amanah_brand {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #12372a;
    text-decoration: none;
}
.amanah_brand_logo {
    width: 34px;
    height: 34px;
    display: none;
}
.amanah_brand_logo svg {
    width: 100%;
    height: 100%;
}
.amanah_brand_logo svg polygon {
    fill: #f5c542;
    stroke: #f5c542;
}
.amanah_brand_logo svg .amanah_logo_bottom {
    fill: #0f5b3f;
    stroke: #0f5b3f;
}
.amanah_brand b {
    display: block;
    font-size: 18px;
    letter-spacing: 0.08em;
}
.amanah_header_spacer {
    margin-left: auto;
    min-width: 42px;
    height: 42px;
}
.amanah_close_btn {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #f1f5ed;
    color: #12372a;
    font-weight: 900;
    text-decoration: none;
}
.amanah_desktop_nav {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 18px;
}
.amanah_desktop_nav a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #12372a;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
}
.amanah_desktop_nav .amanah_menu_icon {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}
.amanah_mobile_cart,
.amanah_mobile_order {
    display: none;
}
.amanah_cart_link span,
.amanah_order_link span {
    display: inline-grid;
    min-width: 22px;
    height: 22px;
    place-items: center;
    margin-left: 4px;
    border-radius: 99px;
    background: #f5c542;
    color: #12372a;
    font-size: 12px;
}
.amanah_searchbar {
    position: relative;
    z-index: 20;
    padding: 22px min(6vw, 64px);
    background: #f6f7f2;
    border-bottom: 1px solid #dde2d7;
}
.amanah_searchbox {
    max-width: 760px;
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 10px;
    align-items: center;
    padding: 10px 14px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
}
.amanah_searchbox input {
    width: 100%;
    border: 0;
    outline: 0;
    color: #12372a;
    font-size: 16px;
    font-weight: 700;
}
.amanah_suggestions {
    max-width: 760px;
    display: none;
    margin-top: 8px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 14px 34px rgba(18,55,42,0.13);
}
.amanah_suggestions_open {
    display: block;
}
.amanah_suggestions a {
    display: none;
    grid-template-columns: 56px 1fr;
    gap: 10px;
    align-items: center;
    padding: 9px;
    border-bottom: 1px solid #eef1ea;
    color: #12372a;
    text-decoration: none;
}
.amanah_suggestions img {
    width: 56px;
    height: 46px;
    border-radius: 7px;
    object-fit: cover;
    grid-row: span 2;
}
.amanah_suggestions span,
.amanah_suggestions small {
    display: block;
}
.amanah_suggestions span {
    font-weight: 900;
}
.amanah_suggestions small {
    color: #657267;
}
.amanah_brand small {
    display: block;
    color: #627065;
    font-size: 12px;
}
.amanah_mark {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: #0f5b3f;
    color: #f5c542;
    display: grid;
    place-items: center;
    font-size: 24px;
    font-weight: 900;
}
.amanah_menu {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 70;
    width: min(340px, 86vw);
    padding: 14px;
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    overflow-y: auto;
    background: #ffffff;
    box-shadow: 16px 0 48px rgba(0,0,0,0.22);
}
.amanah_menu_open .amanah_menu {
    transform: translateX(0);
}
.amanah_menu_scrim {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: none;
    background: rgba(0,0,0,0.35);
}
.amanah_menu_open .amanah_menu_scrim {
    display: block;
}
.amanah_menu_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0 14px;
    border-bottom: 1px solid #dde2d7;
}
.amanah_menu_head button {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 8px;
    background: #f1f5ed;
    color: #12372a;
    font-weight: 900;
}
.amanah_menu a,
.amanah_menu_group b {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 8px;
    border-bottom: 1px solid #eef1ea;
    color: #12372a;
    text-decoration: none;
    font-weight: 900;
}
.amanah_menu_icon {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    color: #0f5b3f;
}
.amanah_menu_group a {
    padding-left: 22px;
    color: #4f5d53;
    font-weight: 700;
}
.amanah_hero {
    min-height: 68vh;
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 38px;
    align-items: center;
    padding: 48px min(6vw, 64px);
    background: linear-gradient(135deg, #12372a 0%, #1f7a55 70%, #f5c542 70%, #f5c542 100%);
    color: #ffffff;
}
.amanah_kicker {
    display: inline-block;
    margin-bottom: 12px;
    color: #f5c542;
    font-weight: 800;
}
.amanah_hero h1 {
    max-width: 740px;
    margin: 0;
    font-size: clamp(38px, 6vw, 76px);
    line-height: 0.98;
}
.amanah_hero p {
    max-width: 650px;
    color: rgba(255,255,255,0.86);
    font-size: 18px;
    line-height: 1.55;
}
.amanah_hero_actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}
.amanah_hero_actions a {
    padding: 13px 18px;
    border-radius: 8px;
    background: #f5c542;
    color: #12372a;
    text-decoration: none;
    font-weight: 900;
}
.amanah_hero_actions a + a {
    background: #ffffff;
}
.amanah_phone {
    width: min(330px, 86vw);
    margin: auto;
    padding: 22px;
    border-radius: 34px;
    background: #ffffff;
    color: #17231d;
    box-shadow: 0 24px 80px rgba(0,0,0,0.25);
}
.amanah_phone_top {
    width: 76px;
    height: 8px;
    border-radius: 99px;
    background: #d9ded6;
    margin: 0 auto 22px;
}
.amanah_mini_card,
.amanah_product,
.amanah_summary,
.amanah_steps div {
    background: #ffffff;
    border: 1px solid #dde2d7;
    border-radius: 8px;
}
.amanah_mini_card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    align-items: center;
    padding: 12px;
    margin-bottom: 10px;
}
.amanah_mini_card small {
    color: #657267;
}
.store_dot {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    display: inline-grid;
    place-items: center;
    color: #ffffff;
    font-weight: 900;
}
.store_green { background: #1f7a55; }
.store_orange { background: #dd7b16; }
.store_blue { background: #2e6ea6; }
.store_red { background: #b33c2f; }
.store_purple { background: #6750a4; }
.store_teal { background: #0f766e; }
.amanah_notice {
    background: #fff4c4;
    color: #332600;
    border-radius: 8px;
    padding: 14px;
    font-weight: 700;
}
.amanah_section {
    padding: 54px min(6vw, 64px);
}
.amanah_section_head {
    max-width: 760px;
    margin-bottom: 24px;
}
.amanah_section_head span,
.amanah_checkout span {
    color: #1f7a55;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 13px;
}
.amanah_section_head h2,
.amanah_checkout h2 {
    margin: 8px 0;
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.05;
}
.amanah_inpage_title {
    margin: 0 0 16px;
    color: #12372a;
    font-size: clamp(24px, 5vw, 38px);
    font-weight: 900;
    line-height: 1.05;
}
.amanah_line_nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}
.amanah_line_nav a {
    padding: 9px 12px;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid #dde2d7;
    color: #12372a;
    text-decoration: none;
    font-weight: 800;
    font-size: 13px;
}
.amanah_product_line {
    scroll-margin-top: 86px;
    margin-bottom: 38px;
}
.amanah_product_line h3 {
    margin: 0 0 14px;
    color: #12372a;
    font-size: 26px;
}
.amanah_catalog {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}
.amanah_product {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.amanah_product_img {
    width: 100%;
    aspect-ratio: 1.1 / 0.78;
    background: #f9faf7;
}
.amanah_product_img img,
.amanah_category_img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
.amanah_product_body {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    flex: 1;
}
.amanah_checkout button {
    border: 0;
    border-radius: 7px;
    background: #0f5b3f;
    color: #ffffff;
    padding: 10px 14px;
    font-weight: 900;
}
.amanah_product button {
    border: 0;
    border-top: 1px solid #dde2d7;
    background: #0f5b3f;
    color: #ffffff;
    padding: 13px;
    font-weight: 900;
    cursor: pointer;
}
.amanah_product h4 {
    margin: 0;
    font-size: 17px;
    line-height: 1.2;
}
.amanah_product p,
.amanah_section_head p,
.amanah_checkout p {
    color: #5d695f;
    line-height: 1.5;
}
.amanah_product p {
    margin: 0;
    font-size: 14px;
}
.amanah_product strong {
    margin-top: auto;
    color: #12372a;
}
.amanah_product_line_tag {
    color: #1f7a55;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}
.amanah_qty {
    display: grid;
    grid-template-columns: 34px 1fr 34px;
    align-items: center;
    width: 118px;
    overflow: hidden;
    border: 1px solid #dde2d7;
    border-radius: 8px;
}
.amanah_qty button {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #f1f5ed;
    color: #12372a;
    font-size: 18px;
    font-weight: 900;
}
.amanah_qty input {
    width: 100%;
    height: 34px;
    border: 0;
    appearance: textfield;
    -moz-appearance: textfield;
    text-align: center;
    color: #12372a;
    font-size: 14px;
    font-weight: 900;
}
.amanah_qty input::-webkit-outer-spin-button,
.amanah_qty input::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}
.amanah_empty {
    padding: 22px;
    border-radius: 8px;
    background: #fff4c4;
    color: #332600;
    font-weight: 800;
}
.amanah_catalog_featured {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.amanah_category_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.amanah_category_card {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 14px;
    align-items: center;
    padding: 14px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
    color: #17231d;
    text-decoration: none;
}
.amanah_category_img {
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    overflow: hidden;
}
.amanah_category_card h3 {
    margin: 0 0 6px;
    color: #12372a;
}
.amanah_category_card p {
    margin: 0 0 8px;
    color: #5d695f;
}
.amanah_category_card span {
    color: #1f7a55;
    font-weight: 900;
}
.amanah_category_page {
    padding-top: 34px;
}
.amanah_breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    color: #5d695f;
    font-size: 14px;
    font-weight: 800;
}
.amanah_breadcrumb a {
    color: #12372a;
    text-decoration: none;
}
.amanah_breadcrumb_back {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
    font-size: 18px;
}
.amanah_subcat_grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 22px;
}
.amanah_subcat_grid a {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #dde2d7;
    background: #ffffff;
    color: #12372a;
    text-decoration: none;
}
.amanah_subcat_grid span {
    color: #1f7a55;
    font-weight: 900;
}
.amanah_benefit {
    padding: 14px;
    margin-bottom: 10px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
}
.amanah_benefit b,
.amanah_benefit small {
    display: block;
}
.amanah_benefit small {
    margin-top: 5px;
    color: #657267;
    line-height: 1.45;
}
.amanah_chat_page_body {
    height: 100vh;
    overflow: hidden;
}
.amanah_chat_page_body main {
    height: calc(100vh - 68px);
}
.amanah_chat_page_body #availability,
.amanah_chat_page_body #bf_footer,
.amanah_chat_page_body .bf_section_copyright {
    display: none;
}
.amanah_chat_full {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #f6f7f2;
}
.amanah_chat_starter {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 40;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    padding: 0 16px;
    border-radius: 999px;
    background: #0f5b3f;
    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    box-shadow: 0 14px 34px rgba(18,55,42,0.24);
}
.amanah_chat_starter .amanah_menu_icon {
    width: 22px;
    height: 22px;
}
.amanah_chat_starter span {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
}
.amanah_chat_full_log {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
}
.amanah_chat_full_entry {
    display: grid;
    grid-template-columns: 1fr 70px;
    gap: 8px;
    padding: 10px;
    border-top: 1px solid #dde2d7;
    background: #ffffff;
}
.amanah_chat_full_entry textarea {
    width: 100%;
    height: 46px;
    resize: none;
    padding: 10px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    font-size: 15px;
}
.amanah_chat_full_entry button {
    border: 0;
    border-radius: 8px;
    background: #0f5b3f;
    color: #ffffff;
    font-weight: 900;
}
.amanah_assistant_quick,
.amanah_assistant_options {
    display: grid;
    gap: 8px;
    max-width: min(620px, 100%);
}
.amanah_assistant_quick {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.amanah_assistant_quick button,
.amanah_assistant_option {
    min-height: 42px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
    color: #12372a;
    cursor: pointer;
    font-weight: 900;
}
.amanah_assistant_option {
    display: grid;
    gap: 4px;
    padding: 10px;
    text-align: left;
}
.amanah_assistant_option b,
.amanah_assistant_option span {
    display: block;
}
.amanah_assistant_option span {
    color: #5d695f;
    font-size: 13px;
    font-weight: 700;
}
@media (max-width: 560px) {
    .amanah_assistant_quick {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.amanah_cart_items {
    display: grid;
    gap: 10px;
    max-width: 900px;
}
.amanah_cart_item {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 16px;
    align-items: stretch;
    padding: 12px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(18,55,42,0.06);
}
.amanah_cart_thumb_link {
    display: block;
    min-height: 150px;
    border-radius: 8px;
    overflow: hidden;
    background: #f9faf7;
}
.amanah_cart_thumb {
    width: 100%;
    height: 100%;
    min-height: 150px;
    object-fit: cover;
}
.amanah_cart_body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.amanah_cart_info {
    min-width: 0;
    color: inherit;
    text-decoration: none;
}
.amanah_cart_info b,
.amanah_cart_info small,
.amanah_cart_info p {
    display: block;
}
.amanah_cart_info b {
    color: #12372a;
    font-size: 18px;
    line-height: 1.2;
}
.amanah_cart_info small {
    margin-top: 4px;
    color: #657267;
}
.amanah_cart_info p {
    margin: 8px 0 0;
    color: #5d695f;
    line-height: 1.4;
    font-size: 14px;
}
.amanah_cart_actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: auto;
}
.amanah_product_detail {
    padding-top: 34px;
}
.amanah_detail_grid {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.1fr);
    gap: 26px;
    align-items: start;
}
.amanah_detail_image {
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #dde2d7;
}
.amanah_detail_image img {
    width: 100%;
    display: block;
    aspect-ratio: 1.1 / 0.82;
    object-fit: cover;
}
.amanah_detail_body {
    display: grid;
    gap: 14px;
}
.amanah_detail_body h2 {
    margin: 0;
    color: #12372a;
    font-size: clamp(30px, 5vw, 52px);
    line-height: 1.04;
}
.amanah_detail_body > strong {
    color: #0f5b3f;
    font-size: 22px;
}
.amanah_detail_body > p {
    margin: 0;
    color: #5d695f;
    line-height: 1.6;
}
.amanah_detail_note {
    padding: 14px;
    border-radius: 8px;
    background: #fff4c4;
    color: #332600;
    font-weight: 800;
    line-height: 1.45;
}
.amanah_detail_body .amanah_product {
    max-width: 420px;
}
.amanah_orders {
    display: grid;
    gap: 12px;
    max-width: 900px;
}
.amanah_order {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 12px;
    align-items: center;
    padding: 16px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
}
.amanah_order b,
.amanah_order small {
    display: block;
}
.amanah_order small,
.amanah_order p {
    color: #657267;
}
.amanah_order span {
    padding: 7px 10px;
    border-radius: 99px;
    background: #fff4c4;
    color: #332600;
    font-weight: 900;
    white-space: nowrap;
}
.amanah_order p {
    grid-column: 1 / -1;
    margin: 0;
}
.amanah_cart_actions strong {
    color: #12372a;
    white-space: nowrap;
}
.amanah_cart_remove,
.amanah_checkout_btn {
    border: 0;
    border-radius: 8px;
    background: #12372a;
    color: #ffffff;
    padding: 11px 14px;
    font-weight: 900;
}
.amanah_cart_remove {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    padding: 0;
    background: #f1f5ed;
    color: #b33c2f;
}
.amanah_cart_remove svg {
    width: 21px;
    height: 21px;
}
.amanah_cart_empty,
.amanah_cart_summary {
    max-width: 900px;
    padding: 16px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
}
.amanah_payment {
    max-width: 900px;
    display: grid;
    gap: 12px;
    margin-top: 12px;
    padding: 16px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    background: #ffffff;
}
.amanah_payment_head {
    display: flex;
    align-items: center;
    gap: 10px;
}
.amanah_payment_head b,
.amanah_payment_head span {
    display: block;
}
.amanah_payment_head span {
    margin-top: 3px;
    color: #657267;
}
.amanah_payment_grid {
    display: grid;
    grid-template-columns: 1.2fr 1.4fr 0.7fr 0.6fr;
    gap: 10px;
}
.amanah_payment_grid input {
    min-width: 0;
    padding: 12px;
    border: 1px solid #dde2d7;
    border-radius: 8px;
    color: #12372a;
    font-weight: 800;
}
.amanah_payment p {
    min-height: 20px;
    margin: 0;
    color: #b33c2f;
    font-weight: 800;
}
.amanah_cart_summary {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
    font-size: 18px;
}
.amanah_checkout_btn {
    margin-top: 14px;
    background: #0f5b3f;
}
.amanah_steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.amanah_steps div {
    padding: 18px;
}
.amanah_steps b {
    display: block;
    color: #dd7b16;
    font-size: 28px;
    margin-bottom: 8px;
}
.amanah_checkout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    align-items: center;
}
.amanah_summary {
    padding: 10px 18px;
}
.amanah_summary div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 0;
    border-bottom: 1px solid #e4e7df;
}
.amanah_summary div:last-child {
    border-bottom: 0;
}
.amanah_body .bf_section_warm {
    background: #17362b;
    color: #fff8e6;
    border-top: 4px solid #f2b84b;
}
.amanah_body .bf_grid_footer {
    display: grid;
    grid-template-columns: 1.35fr 1fr 1fr;
    gap: 28px;
    width: 100%;
    box-sizing: border-box;
    padding: 42px min(6vw, 64px);
}
.amanah_body .bf_stack {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.amanah_body .bf_heading_icon {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #f2b84b;
    font-weight: 900;
}
.amanah_body .bf_section_warm p,
.amanah_body .bf_section_warm span {
    margin: 0;
    color: #fff8e6;
    line-height: 1.5;
}
.amanah_body .bf_heading_icon span {
    color: #f2b84b;
}
.amanah_body .bf_link_row {
    display: flex;
    gap: 10px;
}
.amanah_body .bf_ui_icon {
    width: 28px;
    height: 28px;
    stroke: #f2b84b;
}
.amanah_body .bf_ui_icon_lg {
    width: 38px;
    height: 38px;
}
.amanah_body .bf_section_copyright {
    width: 100%;
    box-sizing: border-box;
    padding: 16px min(6vw, 64px);
    background: #0c1f19;
    color: #fff8e6;
    text-align: center;
}
@media (max-width: 760px) {
    .amanah_nav {
        min-height: 76px;
        padding: 10px 12px;
    }
    .amanah_menu_btn {
        display: grid;
        place-items: center;
        width: 54px;
        height: 54px;
        padding: 7px;
    }
    .amanah_desktop_nav {
        display: none;
    }
    .amanah_nav {
        gap: 9px;
    }
    .amanah_brand b {
        font-size: 20px;
        line-height: 1;
    }
    .amanah_brand small {
        margin-top: 3px;
        font-size: 13px;
        line-height: 1;
    }
    .amanah_mobile_cart,
    .amanah_mobile_order {
        position: relative;
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        flex: 0 0 44px;
        border-radius: 8px;
        background: #f1f5ed;
        text-decoration: none;
    }
    .amanah_mobile_order {
        display: none;
    }
    .amanah_mobile_order.amanah_has_orders {
        display: grid;
    }
    .amanah_mobile_cart .amanah_menu_icon,
    .amanah_mobile_order .amanah_menu_icon {
        width: 28px;
        height: 28px;
        flex-basis: 28px;
    }
    .amanah_mobile_cart span,
    .amanah_mobile_order span {
        position: absolute;
        right: -3px;
        top: -3px;
        min-width: 20px;
        height: 20px;
        display: grid;
        place-items: center;
        border-radius: 99px;
        background: #f5c542;
        color: #12372a;
        font-size: 11px;
        font-weight: 900;
    }
    .amanah_searchbar {
        padding: 14px 12px;
    }
    .amanah_hero,
    .amanah_checkout {
        grid-template-columns: 1fr;
    }
    .amanah_catalog,
    .amanah_category_grid,
    .amanah_subcat_grid,
    .amanah_steps {
        grid-template-columns: 1fr;
    }
    .amanah_catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .amanah_catalog_featured {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .amanah_product_img {
        aspect-ratio: 1 / 0.74;
    }
    .amanah_product_body {
        padding: 10px;
        gap: 7px;
    }
    .amanah_product h4 {
        font-size: 14px;
    }
    .amanah_product p {
        display: none;
    }
    .amanah_product button {
        padding: 10px 6px;
        font-size: 12px;
    }
    .amanah_qty {
        width: 100%;
        grid-template-columns: 30px 1fr 30px;
    }
    .amanah_qty button,
    .amanah_qty input {
        height: 30px;
    }
    .amanah_category_card {
        grid-template-columns: 92px 1fr;
    }
    .amanah_header_spacer {
        flex: 1 1 auto;
        min-width: 0;
    }
    .amanah_close_btn {
        flex: 0 0 42px;
    }
    .amanah_cart_item {
        grid-template-columns: 118px 1fr;
        gap: 10px;
    }
    .amanah_cart_thumb_link {
        min-height: 138px;
    }
    .amanah_cart_thumb {
        width: 100%;
        height: 100%;
        min-height: 138px;
    }
    .amanah_cart_info b {
        font-size: 15px;
    }
    .amanah_cart_info p {
        display: none;
    }
    .amanah_cart_actions {
        gap: 8px;
        justify-content: flex-end;
        flex-wrap: wrap;
    }
    .amanah_cart_qty {
        width: 92px;
    }
    .amanah_cart_remove {
        width: 34px;
        height: 34px;
    }
    .amanah_detail_grid,
    .amanah_order,
    .amanah_payment_grid {
        grid-template-columns: 1fr;
    }
    .amanah_order span,
    .amanah_order strong {
        justify-self: start;
    }
    .amanah_body .bf_grid_footer {
        grid-template-columns: 1fr;
        gap: 22px;
    }
}

@media (min-width: 761px) {
    .amanah_brand_logo {
        display: block;
    }
    .amanah_close_btn,
    .amanah_header_spacer {
        display: none;
    }
    .amanah_menu,
    .amanah_menu_scrim {
        display: none;
    }
}