@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap');

:root{
    --primary:#0879c9;
    --primary-dark:#04548f;
    --primary-light:#e9f7ff;
    --dark:#062b44;
    --text:#29465a;
    --muted:#78909f;
    --bg:#f7fbfe;
    --white:#ffffff;
    --border:#e2edf3;
    --shadow:0 20px 60px rgba(7,70,110,.10);
    --radius:24px;

    --accent:#f5ad28;
    --accent-dark:#a86b06;
    --accent-light:#fff4e0;
}

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

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Vazirmatn',sans-serif;
    background:var(--bg);
    color:var(--text);
    line-height:1.9;
}

body,
button,
input,
textarea,
select{
    font-family:'Vazirmatn',sans-serif;
}

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

button{
    border:none;
    cursor:pointer;
}

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

.container{
    width:min(1180px,92%);
    margin:auto;
}


/* ================= TOPBAR ================= */

.topbar{
    background:#05253b;
    color:#d9f3ff;
    font-size:12px;
}

.topbar-inner{
    min-height:38px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}


/* ================= HEADER ================= */

.header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.94);
    backdrop-filter:blur(18px);
    border-bottom:1px solid var(--border);
}

.navbar{
    height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
}

.logo{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
}

.logo-icon{
     width:83px;
    height:83px;
    display:grid;
    place-items:center;
    background:rgba(255, 253, 253, 0.747);
    color:white;
    border-radius:15px;
    font-size:10px;
    /* box-shadow:0 10px 25px rgb(251, 252, 253);  */
       /* position: relative;
    top: 1px; 
    z-index: 10;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    padding: 15px;
    box-shadow: 0 2px 10px rgba(0,0,0,.15); */
}

.owl-icon{
    width:100%;
    height:100%;
    object-fit: contain;
    display:block;
}

.logo strong{
    display:block;
    font-size:21px;
    color:var(--dark);
    line-height:1.2;
}

.logo small{
    display:block;
    font-size:10px;
    color:var(--muted);
}

.nav-menu{
    display:flex;
    align-items:center;
    gap:25px;
}

.nav-menu a{
    position:relative;
    color:#506b7b;
    font-size:14px;
    font-weight:600;
    transition:.25s;
}

.nav-menu a:hover,
.nav-menu a.active{
    color:var(--primary);
}

.nav-menu a.active:after{
    content:'';
    position:absolute;
    height:3px;
    width:22px;
    border-radius:20px;
    bottom:-28px;
    right:50%;
    transform:translateX(50%);
    background:var(--primary);
}

.nav-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.cart-button{
    width:45px;
    height:45px;
    display:grid;
    place-items:center;
    border-radius:14px;
    color:var(--primary);
    background:var(--primary-light);
    position:relative;
}

.cart-count{
    position:absolute;
    top:-5px;
    left:-5px;
    width:20px;
    height:20px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#ff5c73;
    color:#fff;
    font-size:10px;
}

.mobile-menu{
    display:none;
    width:45px;
    height:45px;
    background:var(--primary-light);
    color:var(--primary);
    border-radius:14px;
}


/* ================= BUTTON ================= */

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:12px 22px;
    border-radius:14px;
    font-size:13px;
    font-weight:800;
    transition:.3s;
}

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

.btn-primary{
    color:white;
    background:linear-gradient(135deg,#0879c9,#12a8e9);
    box-shadow:0 12px 28px rgba(8,121,201,.22);
}

.btn-white{
    color:var(--primary);
    background:white;
}

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

.btn-outline-white{
    border:1px solid rgba(255,255,255,.6);
    color:#fff;
}

.btn-large{
    padding:15px 26px;
}


/* ================= HERO ================= */

.hero{
    position:relative;
    min-height:650px;
    overflow:hidden;
    display:flex;
    align-items:center;
    background:#063a5d;
}

.hero-bg{
    position:absolute;
    inset:0;
    background:
        url('/images/Green-cheeked Conure.jpg')
        center/cover no-repeat;
    transform:scale(1.02);
}

.hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(2,25,42,.94),
            rgba(3,75,118,.68),
            rgba(5,82,124,.18)
        );
}

.hero-content{
    position:relative;
    z-index:2;
    color:#fff;
    padding:110px 0;
    max-width:730px;
    margin-right:auto;
    margin-left:auto;
}

.hero-label{
    display:inline-flex;
    padding:7px 15px;
    border-radius:50px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.2);
    font-size:12px;
    font-weight:700;
}

.hero h1{
    font-size:43px;
    line-height:1.35;
    margin:18px 0;
    letter-spacing:-1px;
}

.hero p{
    color:#e5f7ff;
    max-width:650px;
    font-size:15px;
}

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

.hero-badge{
    position:absolute;
    left:7%;
    bottom:70px;
    z-index:4;
    display:flex;
    align-items:center;
    gap:12px;
    padding:13px 18px;
    color:#fff;
    background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.18);
    border-radius:18px;
    backdrop-filter:blur(15px);
}

.badge-icon{
    width:42px;
    height:42px;
    border-radius:12px;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.15);
}

.hero-badge strong{
    display:block;
    font-size:13px;
}

.hero-badge span{
    display:block;
    color:#d4edf8;
    font-size:11px;
}


/* ================= FEATURES ================= */

.features-section{
    position:relative;
    margin-top:-50px;
    z-index:10;
}

.features{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    background:#fff;
    border-radius:25px;
    box-shadow:var(--shadow);
    padding:25px;
}

.feature{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    padding:12px;
    border-left:1px solid var(--border);
}

.feature:last-child{
    border-left:0;
}

.feature-icon{
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    border-radius:15px;
    color:var(--primary);
    background:var(--primary-light);
    font-size:21px;
}

.feature-icon.accent{
    color:var(--accent-dark);
    background:var(--accent-light);
}

.feature strong{
    display:block;
    color:var(--dark);
    font-size:13px;
}

.feature span{
    display:block;
    color:var(--muted);
    font-size:10px;
}


/* ================= SECTION ================= */

.section{
    padding:95px 0;
}

.section-heading{
    text-align:center;
    max-width:680px;
    margin:0 auto 45px;
}

.section-heading > span{
    display:inline-block;
    color:var(--primary);
    background:var(--primary-light);
    padding:6px 14px;
    border-radius:50px;
    font-size:12px;
    font-weight:800;
}

.section-heading h2{
    color:var(--dark);
    font-size:clamp(28px,4vw,42px);
    line-height:1.4;
    margin:12px 0;
  
}

.section-heading h2 strong{
    color:var(--primary);
}

.section-heading p{
    color:var(--muted);
    font-size:14px;
}


/* ================= BIRDS ================= */

.bird-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}

.bird-card{
    background:#fff;
    border-radius:23px;
    overflow:hidden;
    border:1px solid var(--border);
    box-shadow:var(--shadow);
    transition:.35s;
}

.bird-card:hover{
    transform:translateY(-8px);
}

.bird-image{
    height:220px;
    overflow:hidden;
    background:#f4fbff;
    display:flex;
    align-items:center;
    justify-content:center;
}

.bird-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
    transition:.5s;
}

.bird-card:hover img{
    transform:scale(1.06);
}

.bird-content{
    padding:20px;
}

.bird-content h3{
    color:var(--dark);
    font-size:18px;
}

.bird-content p{
    color:var(--muted);
    font-size:12px;
}

.bird-content span{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:13px;
    color:var(--primary);
    font-size:11px;
    font-weight:800;
}


/* ================= STATS ================= */

.stats-section{
    background:
        linear-gradient(
            135deg,
            #052d48,
            #0879c9
        );
    color:#fff;
}

.stats-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.stat{
    padding:55px 15px;
    text-align:center;
    border-left:1px solid rgba(255,255,255,.12);
}

.stat:last-child{
    border-left:0;
}

.stat strong{
    display:block;
    font-size:42px;
    font-weight:900;
}

.stat span{
    color:#d7f2ff;
    font-size:12px;
}


/* ================= SERVICES ================= */

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

.service-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:25px;
    overflow:hidden;
    box-shadow:var(--shadow);
    transition:.3s;
}

.service-card:hover{
    transform:translateY(-7px);
}

.service-card > img{
    width:100%;
    height:240px;
    object-fit:cover;
    object-position:top;
}

.service-content{
    position:relative;
    padding:25px;
}

.service-icon{
    position:absolute;
    top:-28px;
    left:25px;
    width:56px;
    height:56px;
    display:grid;
    place-items:center;
    border-radius:17px;
    color:#04548f;
    background:linear-gradient(135deg,#0879c9,#11a9e9);
    box-shadow:0 10px 25px rgba(8,121,201,.25);
}

.service-content h3{
    color:var(--dark);
    margin-top:12px;
}

.service-content p{
    color:var(--muted);
    font-size:13px;
    margin:7px 0;
}

.service-content a{
    color:var(--primary);
    font-size:12px;
    font-weight:800;
}


/* ================= PRODUCTS ================= */

.products-section{
    background:#eef9ff;
}

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

.product-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:24px;
    overflow:hidden;
    box-shadow:var(--shadow);
}

.product-image{
    /* height:270px; */
    position:relative;
    background:#f4fbff;
    overflow:hidden;
}

.product-image span{
    position:absolute;
    top:15px;
    right:15px;
    z-index:2;
    padding:5px 11px;
    border-radius:50px;
    background:#fff;
    color:var(--primary);
    font-size:10px;
    font-weight:800;
    box-shadow:0 8px 18px rgba(6,43,68,.12);
}

.tag-bestseller{
    background:#ff6b6b;
    color:#fff;
}

.tag-new{
    background:#22b573;
    color:#fff;
}

.tag-special{
    background:var(--accent);
    color:#5c3a00;
}

.product-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top;
    transition:.4s;
}

.product-card:hover .product-image img{
    transform:scale(1.05);
}

.product-info{
    padding:20px;
}

.product-info h3{
    color:var(--dark);
    font-size:16px;
}

.product-info p{
    color:var(--muted);
    font-size:12px;
}

.product-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-top:18px;
}

.product-bottom strong{
    color:var(--primary);
    font-size:18px;
}

.product-bottom small{
    font-size:10px;
    color:var(--muted);
}

.add-cart{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:var(--primary-light);
    color:var(--primary);
    transition:.25s;
}

.add-cart:hover{
    background:var(--primary);
    color:#fff;
}

.center-button{
    text-align:center;
    margin-top:30px;
}


/* ================= DOCTORS ================= */

.doctors-section{
    background:#fff;
}

.doctor-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:25px;
}

.doctor-card{
    display:flex;
    gap:20px;
    padding:18px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:25px;
    box-shadow:var(--shadow);
}

.doctor-card > img{
    width:190px;
    height:230px;
    object-fit:cover;
    object-position:top;
    border-radius:19px;
}

.doctor-content{
    padding:10px 0;
}

.doctor-content > span{
    color:var(--primary);
    font-size:11px;
}

.doctor-content h3{
    color:var(--dark);
    font-size:20px;
    margin:4px 0;
}

.stars{
    color:#f5ad28;
    font-size:14px;
}

.stars i{
    margin-left:2px;
}

.stars small{
    margin-right:4px;
    color:var(--muted);
}

.doctor-content p{
    color:var(--muted);
    font-size:12px;
    margin:10px 0 18px;
}


/* ================= REVIEWS ================= */

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

.review-card{
    background:#fff;
    padding:27px;
    border:1px solid var(--border);
    border-radius:23px;
    box-shadow:var(--shadow);
}

.review-stars{
    color:#f6af2d;
    font-size:13px;
}

.review-stars i{
    margin-left:2px;
}

.review-card p{
    color:#5c7482;
    font-size:13px;
    margin:14px 0;
}

.review-card strong{
    color:var(--dark);
    font-size:13px;
}


/* ================= CTA ================= */

.cta{
    padding:80px 0;
    background:
        linear-gradient(
            135deg,
            #0879c9,
            #0ca9e9
        );
    text-align:center;
    color:#fff;
}

.cta-content > span{
    font-size:12px;
    color:#dff7ff;
}

.cta-label{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:6px 14px;
    border-radius:50px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.2);
}

.cta-label-icon{
    width:16px;
    height:16px;
}

.cta h2{
    font-size:clamp(30px,4vw,45px);
    margin:10px 0;
}

.cta p{
    color:#e4f8ff;
    margin-bottom:25px;
}

.cta .btn-outline-white{
    margin-right:8px;
}


/* ================= FOOTER ================= */

.footer{
    background:#041e31;
    color:#b8d0dd;
    padding-top:65px;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr 1fr;
    gap:50px;
}

.footer-logo strong{
    color:#fff;
}

.footer-logo small{
    color:#9cb7c5;
}

.footer-about p{
    max-width:350px;
    font-size:12px;
    margin:18px 0;
}

.socials{
    display:flex;
    gap:8px;
}

.socials a{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#0a3048;
    color:#8ddcff;
}

.footer h4{
    color:#fff;
    margin-bottom:15px;
}

.footer-links{
    display:grid;
    gap:8px;
}

.footer-links a{
    color:#9db7c5;
    font-size:12px;
    transition:.2s;
}

.footer-links a:hover{
    color:#fff;
}

.footer-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-top:1px solid rgba(255,255,255,.08);
    margin-top:45px;
    padding:20px 0;
    font-size:10px;
}

.heart-icon{
    margin-right:4px;
    color:var(--accent);
}


/* ================= TOAST ================= */

.toast{
    position:fixed;
    right:25px;
    bottom:25px;
    z-index:9999;
    padding:14px 20px;
    background:#052d48;
    color:#fff;
    border-radius:14px;
    box-shadow:0 15px 45px rgba(0,0,0,.2);
    transform:translateY(120px);
    opacity:0;
    transition:.3s;
    font-size:12px;
}

.toast.show{
    transform:translateY(0);
    opacity:1;
}


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

@media(max-width:1000px){

    .nav-menu{
        gap:14px;
    }

    .nav-menu a{
        font-size:12px;
    }

    .features{
        grid-template-columns:repeat(2,1fr);
    }

    .feature{
        border-bottom:1px solid var(--border);
    }

    .bird-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .stats-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .stat:nth-child(2){
        border-left:0;
    }

    .service-grid,
    .product-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .footer-grid{
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:760px){

    .topbar{
        display:none;
    }

    .navbar{
        height:70px;
    }

    .mobile-menu{
        display:block;
    }

    .nav-menu{
        display:none;
        position:absolute;
        top:70px;
        right:4%;
        left:4%;
        padding:15px;
        background:#fff;
        border-radius:20px;
        box-shadow:var(--shadow);
        flex-direction:column;
        align-items:stretch;
    }

    .nav-menu.show{
        display:flex;
    }

    .nav-menu a{
        padding:10px 12px;
    }

    .nav-menu a.active:after{
        display:none;
    }

    .nav-actions .btn{
        display:none;
    }

    .hero{
        min-height:600px;
    }

    .hero-content{
        padding:100px 0;
    }

    .hero h1{
        font-size:40px;
    }

    .hero p{
        font-size:14px;
    }

    .hero-badge{
        display:none;
    }

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

    .feature{
        border-left:0;
    }

    .bird-grid,
    .service-grid,
    .product-grid,
    .doctor-grid,
    .reviews-grid{
        grid-template-columns:1fr;
    }

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

    .doctor-card{
        flex-direction:column;
    }

    .doctor-card > img{
        width:100%;
        height:280px;
    }

    .footer-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .footer-bottom{
        flex-direction:column;
        gap:8px;
        text-align:center;
    }

}


@media(max-width:480px){

    .container{
        width:90%;
    }

    .logo strong{
        font-size:18px;
    }

    .logo-icon{
        width:43px;
        height:43px;
    }

    .hero h1{
        font-size:34px;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .hero-buttons .btn{
        width:100%;
    }

    .section{
        padding:70px 0;
    }

    .section-heading{
        margin-bottom:30px;
    }

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

    .stat{
        border-left:0;
        border-bottom:1px solid rgba(255,255,255,.12);
    }

    .stat:last-child{
        border-bottom:0;
    }

}


/* =====================================================
   SHOP / PRODUCT / CART / CHECKOUT
===================================================== */


/* ================= PAGE HERO ================= */

.page-hero{
    padding:75px 0;
    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(16,169,233,.18),
            transparent 35%
        ),
        linear-gradient(
            135deg,
            #eaf8ff,
            #f8fcff
        );
    border-bottom:1px solid var(--border);
}

.page-hero.compact{
    padding:55px 0;
}

.page-hero span{
    display:inline-flex;
    padding:6px 14px;
    background:#dff4ff;
    color:var(--primary);
    border-radius:50px;
    font-size:11px;
    font-weight:800;
}

.page-hero h1{
    color:var(--dark);
    font-size:clamp(32px,5vw,48px);
    margin:10px 0;
}

.page-hero h1 strong{
    color:var(--primary);
}

.page-hero p{
    color:var(--muted);
    max-width:600px;
    font-size:14px;
}


/* ================= SEARCH ================= */

.shop-search{
    display:flex;
    gap:12px;
    margin-bottom:25px;
}

.search-box{
    position:relative;
    flex:1;
}

.search-box i{
    position:absolute;
    right:18px;
    top:50%;
    transform:translateY(-50%);
    color:var(--primary);
}

.search-box input{
    width:100%;
    height:58px;
    padding:0 52px 0 20px;
    border:1px solid var(--border);
    border-radius:17px;
    background:#fff;
    outline:none;
    font-size:13px;
    transition:.25s;
}

.search-box input:focus{
    border-color:#72c8ed;
    box-shadow:0 0 0 4px rgba(8,121,201,.08);
}

.filter-mobile-btn{
    display:none;
    padding:0 20px;
    border-radius:16px;
    color:var(--primary);
    background:var(--primary-light);
}


/* ================= SHOP LAYOUT ================= */

.shop-layout{
    display:grid;
    grid-template-columns:260px 1fr;
    gap:28px;
    align-items:start;
}


/* ================= SIDEBAR ================= */

.shop-sidebar{
    position:sticky;
    top:105px;
    background:#fff;
    padding:22px;
    border:1px solid var(--border);
    border-radius:22px;
    box-shadow:var(--shadow);
}

.sidebar-title{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-bottom:17px;
    border-bottom:1px solid var(--border);
}

.sidebar-title h3{
    color:var(--dark);
    font-size:16px;
}

.sidebar-title button{
    color:var(--primary);
    background:none;
    font-size:10px;
    font-weight:700;
}

.filter-group{
    padding:20px 0;
    border-bottom:1px solid var(--border);
}

.filter-group:last-of-type{
    border-bottom:0;
}

.filter-group h4{
    color:var(--dark);
    font-size:13px;
    margin-bottom:12px;
}

.check-item{
    display:flex;
    align-items:center;
    gap:10px;
    margin:10px 0;
    color:#657f8d;
    font-size:12px;
    cursor:pointer;
}

.check-item input{
    accent-color:var(--primary);
}

.price-inputs{
    display:flex;
    align-items:center;
    gap:6px;
}

.price-inputs input{
    width:100%;
    min-width:0;
    height:40px;
    border:1px solid var(--border);
    border-radius:10px;
    outline:none;
    padding:0 8px;
    font-size:11px;
}

.price-inputs span{
    color:var(--muted);
    font-size:10px;
}

.filter-submit{
    width:100%;
    margin-top:18px;
}


/* ================= TOOLBAR ================= */

.shop-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:20px;
}

.shop-toolbar > div{
    display:flex;
    gap:5px;
    align-items:center;
}

.shop-toolbar strong{
    color:var(--dark);
    font-size:13px;
}

.shop-toolbar span{
    color:var(--muted);
    font-size:11px;
}

.shop-toolbar select{
    border:1px solid var(--border);
    background:#fff;
    border-radius:12px;
    height:43px;
    padding:0 13px;
    color:var(--text);
    outline:none;
    font-size:11px;
}


/* ================= PRODUCTS ================= */

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

.shop-product-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:21px;
    overflow:hidden;
    transition:.3s;
}

.shop-product-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow);
}

.shop-product-image{
    display:block;
    height:225px;
    position:relative;
    overflow:hidden;
    background:#f4fbff;
}

.shop-product-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top;
    transition:.5s;
}

.shop-product-card:hover .shop-product-image img{
    transform:scale(1.05);
}

.product-badge{
    position:absolute;
    z-index:3;
    top:12px;
    right:12px;
    padding:5px 10px;
    border-radius:50px;
    background:var(--primary);
    color:#fff;
    font-size:9px;
    font-weight:800;
}

.stock-badge{
    position:absolute;
    z-index:3;
    bottom:12px;
    right:12px;
    padding:5px 9px;
    border-radius:50px;
    background:#fff;
    color:#ef6875;
    font-size:9px;
    font-weight:700;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.shop-product-info{
    padding:17px;
}

.product-category{
    color:var(--primary);
    font-size:9px;
    font-weight:800;
    margin-bottom:5px;
}

.shop-product-title{
    display:block;
    color:var(--dark);
    font-size:14px;
    font-weight:800;
    line-height:1.7;
}

.product-rating{
    display:flex;
    align-items:center;
    gap:6px;
    margin:6px 0;
}

.stars-small{
    display:flex;
    gap:2px;
    color:#f4af2a;
    font-size:10px;
}

.product-rating small{
    color:var(--muted);
    font-size:9px;
}

.shop-product-description{
    height:43px;
    overflow:hidden;
    color:var(--muted);
    font-size:10px;
    line-height:1.9;
}

.shop-price-row{
    display:flex;
    align-items:end;
    justify-content:space-between;
    margin-top:14px;
}

.shop-price-row del{
    display:block;
    color:#a5b7c0;
    font-size:9px;
}

.shop-price-row strong{
    display:block;
    color:var(--primary);
    font-size:17px;
}

.shop-price-row strong small{
    font-size:9px;
    font-weight:500;
}

.quick-add{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border-radius:12px;
    color:var(--primary);
    background:var(--primary-light);
    transition:.25s;
}

.quick-add:hover{
    color:#fff;
    background:var(--primary);
}

.no-products{
    min-height:350px;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    background:#fff;
    border:1px solid var(--border);
    border-radius:22px;
}

.no-products i{
    font-size:45px;
    color:#b9ddeb;
}

.no-products h3{
    color:var(--dark);
    margin-top:10px;
}

.no-products p{
    color:var(--muted);
    font-size:12px;
}


/* ================= DOCTORS PAGE ================= */

.doctor-filters{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:15px;
}

.doctor-filter{
    padding:10px 22px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:50px;
    color:var(--text);
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    transition:.25s ease;
}

.doctor-filter:hover{
    border-color:var(--primary);
    color:var(--primary);
}

.doctor-filter.active{
    background:var(--primary);
    border-color:var(--primary);
    color:#fff;
}

.doctors-result-bar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:25px;
    color:var(--muted);
    font-size:13px;
}

.doctor-avatar{
    flex:0 0 190px;
    width:190px;
    height:230px;
    display:grid;
    place-items:center;
    border-radius:19px;
    background:linear-gradient(145deg,var(--primary-light),#eaf6ff);
    font-size:70px;
    color:var(--primary);
}

.doctor-card{
    transition:.3s ease;
}

.doctor-card.hidden{
    display:none;
}

.doctor-content .btn{
    margin-left:8px;
}

.no-result{
    display:none;
}

.no-result.show{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:6px;
    padding:80px 20px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:25px;
}

.no-result .empty-cart-icon{
    margin-bottom:8px;
}

.no-result h2{
    color:var(--dark);
    margin:5px 0;
}

.no-result p{
    color:var(--muted);
    font-size:12px;
}


/* ================= BREADCRUMB ================= */

.breadcrumb{
    display:flex;
    align-items:center;
    gap:10px;
    padding-top:25px;
    color:var(--muted);
    font-size:11px;
}

.breadcrumb a{
    color:var(--primary);
}

.breadcrumb i{
    font-size:8px;
}


/* ================= PRODUCT DETAIL ================= */

.product-detail-section{
    padding-top:45px;
}

.product-detail{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:55px;
    align-items:center;
}

.product-gallery{
    min-width:0;
}

.product-main-image{
    position:relative;
    height:540px;
    border-radius:30px;
    overflow:hidden;
    background:#eefaff;
    border:1px solid var(--border);
}

.product-main-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top;
}

.product-detail-badge{
    position:absolute;
    z-index:3;
    top:20px;
    right:20px;
    padding:7px 15px;
    border-radius:50px;
    background:var(--primary);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.product-detail-content h1{
    color:var(--dark);
    font-size:clamp(28px,4vw,42px);
    line-height:1.5;
    margin:5px 0 10px;
}

.detail-rating{
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--muted);
    font-size:11px;
}

.detail-rating strong{
    color:var(--dark);
}

.detail-description{
    color:#5f7785;
    font-size:13px;
    line-height:2.2;
    margin:20px 0;
}

.detail-stock{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#159c70;
    background:#eafbf4;
    border-radius:10px;
    padding:8px 12px;
    font-size:11px;
}

.detail-price{
    margin:22px 0;
}

.detail-price del{
    display:block;
    color:#9fb1ba;
    font-size:11px;
}

.detail-price strong{
    display:block;
    color:var(--primary);
    font-size:29px;
}

.detail-price small{
    font-size:11px;
}

.detail-actions{
    display:flex;
    align-items:center;
    gap:12px;
}

.quantity-picker{
    display:flex;
    height:52px;
    border:1px solid var(--border);
    border-radius:14px;
    overflow:hidden;
    background:#fff;
}

.quantity-picker button{
    width:42px;
    background:#f3faff;
    color:var(--primary);
    font-size:20px;
}

.quantity-picker input{
    width:48px;
    text-align:center;
    border:0;
    outline:none;
    color:var(--dark);
    font-weight:700;
}

.detail-benefits{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    margin-top:30px;
}

.detail-benefits > div{
    padding:13px;
    background:#f6fbfe;
    border-radius:14px;
}

.detail-benefits i{
    color:var(--primary);
    font-size:17px;
}

.detail-benefits strong{
    display:block;
    color:var(--dark);
    font-size:10px;
}

.detail-benefits span{
    display:block;
    color:var(--muted);
    font-size:8px;
}


/* ================= RELATED ================= */

.related-section{
    background:#effaff;
}

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


/* ================= CART ================= */

.cart-page-layout{
    display:grid;
    grid-template-columns:1fr 330px;
    gap:25px;
    align-items:start;
}

.cart-list{
    background:#fff;
    border:1px solid var(--border);
    border-radius:23px;
    overflow:hidden;
}

.cart-list-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:22px;
    border-bottom:1px solid var(--border);
}

.cart-list-header h2{
    color:var(--dark);
    font-size:18px;
}

.cart-list-header span{
    color:var(--muted);
    font-size:11px;
}

.cart-table-head{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1fr 35px;
    padding:13px 22px;
    background:#f7fbfd;
    color:var(--muted);
    font-size:10px;
}

.cart-row{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1fr 35px;
    align-items:center;
    padding:20px 22px;
    border-bottom:1px solid var(--border);
    gap:10px;
}

.cart-product{
    display:flex;
    align-items:center;
    gap:13px;
    min-width:0;
}

.cart-product img{
    width:70px;
    height:70px;
    object-fit:cover;
    border-radius:14px;
    background:#f1faff;
}

.cart-product strong{
    display:block;
    color:var(--dark);
    font-size:12px;
}

.cart-product span{
    display:block;
    color:var(--muted);
    font-size:9px;
}

.cart-unit-price,
.cart-item-total{
    color:#617a89;
    font-size:11px;
}

.cart-item-total strong{
    color:var(--primary);
}

.cart-unit-price small,
.cart-item-total small{
    font-size:8px;
}

.quantity{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    border:1px solid var(--border);
    border-radius:10px;
    overflow:hidden;
}

.quantity button{
    width:30px;
    height:32px;
    background:#f3faff;
    color:var(--primary);
    font-size:16px;
}

.quantity strong{
    min-width:32px;
    text-align:center;
    font-size:11px;
    color:var(--dark);
}

.remove-item{
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    color:#ef6574;
    background:#fff0f2;
    border-radius:9px;
}

.cart-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:20px 22px;
}

.clear-cart{
    background:none;
    color:#ef6574;
    font-size:11px;
    font-weight:700;
}

.cart-summary-box{
    position:sticky;
    top:105px;
    padding:23px;
    border-radius:23px;
    background:#fff;
    border:1px solid var(--border);
    box-shadow:var(--shadow);
}

.cart-summary-box h2{
    color:var(--dark);
    font-size:18px;
    margin-bottom:20px;
}

.summary-row,
.summary-total-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:13px 0;
    color:var(--muted);
    font-size:11px;
}

.summary-row strong{
    color:var(--dark);
}

.summary-total-row{
    color:var(--dark);
    font-weight:800;
}

.summary-total-row strong{
    color:var(--primary);
    font-size:20px;
}

.cart-summary-box hr{
    border:0;
    border-top:1px solid var(--border);
    margin:18px 0;
}

.cart-summary-box > .btn{
    width:100%;
    margin-top:12px;
}

.free-shipping-message{
    margin:16px 0;
    padding:12px;
    border-radius:12px;
    color:#8a6d1e;
    background:#fff8df;
    font-size:9px;
    line-height:1.8;
}

.free-shipping-message i{
    color:#e7a92a;
    margin-left:4px;
}

.free-shipping-message.success{
    color:#168a66;
    background:#eafbf4;
}

.free-shipping-message.success i{
    color:#168a66;
}

.secure-payment{
    text-align:center;
    color:#7e98a5;
    font-size:9px;
    margin-top:14px;
}

.secure-payment i{
    color:#13a579;
    margin-left:4px;
}

.empty-cart{
    padding:80px 20px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:25px;
    text-align:center;
}

.empty-cart-icon{
    width:80px;
    height:80px;
    display:grid;
    place-items:center;
    margin:auto;
    border-radius:25px;
    background:var(--primary-light);
    color:var(--primary);
    font-size:32px;
}

.empty-cart h2{
    color:var(--dark);
    margin:15px 0 5px;
}

.empty-cart p{
    color:var(--muted);
    font-size:12px;
    margin-bottom:20px;
}


/* ================= CART BENEFITS ================= */

.cart-benefits{
    padding:30px 0;
    background:#eaf8ff;
}

.cart-benefits .container{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
}

.cart-benefits .container > div{
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px;
    background:#fff;
    border-radius:15px;
}

.cart-benefits i{
    color:var(--primary);
    font-size:22px;
}

.cart-benefits strong{
    display:block;
    color:var(--dark);
    font-size:11px;
}

.cart-benefits span{
    display:block;
    color:var(--muted);
    font-size:8px;
}


/* ================= CHECKOUT ================= */

.checkout-security{
    display:flex;
    align-items:center;
    gap:8px;
    color:#15946c;
    font-size:11px;
    font-weight:700;
}

.checkout-section{
    padding-top:50px;
}

.checkout-layout{
    display:grid;
    grid-template-columns:1fr 350px;
    gap:25px;
    align-items:start;
}

.checkout-form{
    display:grid;
    gap:20px;
}

.checkout-card{
    padding:25px;
    border-radius:23px;
    background:#fff;
    border:1px solid var(--border);
}

.checkout-card-title{
    display:flex;
    align-items:center;
    gap:13px;
    margin-bottom:25px;
}

.checkout-card-title > span{
    width:35px;
    height:35px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:var(--primary-light);
    color:var(--primary);
    font-size:13px;
    font-weight:900;
}

.checkout-card-title h3{
    color:var(--dark);
    font-size:16px;
}

.checkout-card-title p{
    color:var(--muted);
    font-size:9px;
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}

.form-field{
    display:flex;
    flex-direction:column;
    gap:7px;
}

.form-field.full{
    grid-column:1/-1;
}

.form-field label{
    color:var(--dark);
    font-size:11px;
    font-weight:700;
}

.form-field input,
.form-field select,
.form-field textarea{
    width:100%;
    border:1px solid var(--border);
    border-radius:12px;
    outline:none;
    background:#fbfdff;
    padding:11px 13px;
    color:var(--text);
    font-size:11px;
    resize:vertical;
    transition:.2s;
}

.form-field input,
.form-field select{
    height:46px;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
    border-color:#76c9ed;
    box-shadow:0 0 0 4px rgba(8,121,201,.07);
    background:#fff;
}

.shipping-option,
.payment-option{
    display:flex;
    align-items:center;
    gap:14px;
    padding:17px;
    border:1px solid var(--border);
    border-radius:15px;
    margin-top:12px;
    cursor:pointer;
    transition:.2s;
}

.shipping-option.active,
.payment-option.active{
    border-color:#74c9ed;
    background:#f2fbff;
}

.shipping-option input,
.payment-option input{
    accent-color:var(--primary);
}

.shipping-icon,
.payment-icon{
    width:43px;
    height:43px;
    display:grid;
    place-items:center;
    border-radius:12px;
    color:var(--primary);
    background:var(--primary-light);
}

.shipping-info,
.payment-option > div:last-child{
    flex:1;
}

.shipping-info strong,
.payment-option strong{
    display:block;
    color:var(--dark);
    font-size:11px;
}

.shipping-info span,
.payment-option span{
    display:block;
    color:var(--muted);
    font-size:8px;
}

.shipping-option > b{
    color:var(--primary);
    font-size:10px;
}

.terms-field{
    margin-top:0;
}

.terms-field label{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:8px;
    color:var(--muted);
    font-size:10px;
    font-weight:400;
}

.terms-field input{
    width:auto;
    accent-color:var(--primary);
}

.checkout-submit{
    width:100%;
}

.checkout-summary{
    position:sticky;
    top:105px;
}

.summary-card{
    padding:23px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:23px;
    box-shadow:var(--shadow);
}

.summary-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-bottom:18px;
    border-bottom:1px solid var(--border);
}

.summary-title h3{
    color:var(--dark);
    font-size:17px;
}

.summary-title a{
    color:var(--primary);
    font-size:10px;
    font-weight:800;
}

.checkout-items{
    padding:10px 0;
    max-height:310px;
    overflow:auto;
}

.checkout-item{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 0;
}

.checkout-item-image{
    position:relative;
}

.checkout-item img{
    width:54px;
    height:54px;
    border-radius:12px;
    object-fit:cover;
}

.checkout-item-image span{
    position:absolute;
    top:-6px;
    left:-6px;
    min-width:19px;
    height:19px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--primary);
    color:#fff;
    font-size:8px;
}

.checkout-item strong{
    display:block;
    color:var(--dark);
    font-size:10px;
}

.checkout-item > div:last-child span{
    display:block;
    color:var(--primary);
    font-size:9px;
    margin-top:3px;
}

.summary-lines{
    padding:15px 0;
    border-top:1px solid var(--border);
}

.summary-lines > div{
    display:flex;
    justify-content:space-between;
    margin:10px 0;
    color:var(--muted);
    font-size:10px;
}

.summary-lines strong{
    color:var(--dark);
}

.summary-total{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-top:15px;
    border-top:1px solid var(--border);
    color:var(--dark);
    font-size:12px;
    font-weight:800;
}

.summary-total strong{
    color:var(--primary);
    font-size:19px;
}

.trust-card{
    margin-top:15px;
    padding:18px;
    background:#eaf8ff;
    border-radius:20px;
}

.trust-card > div{
    display:flex;
    gap:10px;
    margin:8px 0;
}

.trust-card i{
    color:var(--primary);
    font-size:18px;
}

.trust-card strong{
    display:block;
    color:var(--dark);
    font-size:10px;
}

.trust-card span{
    display:block;
    color:var(--muted);
    font-size:8px;
}

.checkout-empty{
    text-align:center;
    padding:20px;
}

.checkout-empty i{
    color:#b6dce9;
    font-size:30px;
}


/* ================= SUCCESS MODAL ================= */

.success-modal{
    position:fixed;
    inset:0;
    z-index:99999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:rgba(1,29,47,.68);
    backdrop-filter:blur(8px);
}

.success-modal.show{
    display:flex;
}

.success-box{
    width:min(450px,100%);
    padding:40px 30px;
    background:#fff;
    border-radius:27px;
    text-align:center;
    box-shadow:0 30px 100px rgba(0,0,0,.25);
}

.success-icon{
    width:75px;
    height:75px;
    display:grid;
    place-items:center;
    margin:auto;
    border-radius:50%;
    background:#e7fbf3;
    color:#13a579;
    font-size:30px;
}

.success-box h2{
    color:var(--dark);
    margin:15px 0 5px;
}

.success-box p{
    color:var(--muted);
    font-size:12px;
}

.success-box > span{
    display:block;
    margin:13px 0 20px;
    color:var(--primary);
    font-size:12px;
    font-weight:800;
}

.success-box .btn{
    width:100%;
}


/* ================= RESPONSIVE SHOP ================= */

@media(max-width:1100px){

    .shop-product-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .cart-page-layout{
        grid-template-columns:1fr 300px;
    }

}


@media(max-width:850px){

    .shop-layout{
        grid-template-columns:1fr;
    }

    .filter-mobile-btn{
        display:block;
    }

    .shop-sidebar{
        display:none;
        position:relative;
        top:0;
    }

    .shop-sidebar.show{
        display:block;
    }

    .shop-product-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .product-detail{
        grid-template-columns:1fr;
        gap:30px;
    }

    .product-main-image{
        height:450px;
    }

    .cart-page-layout,
    .checkout-layout{
        grid-template-columns:1fr;
    }

    .cart-summary-box,
    .checkout-summary{
        position:static;
    }

    .cart-benefits .container{
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:600px){

    .page-hero{
        padding:50px 0;
    }

    .shop-search{
        flex-direction:column;
    }

    .filter-mobile-btn{
        width:100%;
        height:48px;
    }

    .shop-product-grid{
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .shop-product-image{
        height:170px;
    }

    .shop-product-info{
        padding:12px;
    }

    .shop-product-title{
        font-size:11px;
    }

    .shop-product-description{
        font-size:9px;
    }

    .shop-price-row strong{
        font-size:13px;
    }

    .quick-add{
        width:35px;
        height:35px;
    }

    .product-main-image{
        height:350px;
    }

    .detail-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .quantity-picker{
        justify-content:center;
    }

    .detail-benefits{
        grid-template-columns:1fr;
    }

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

    .cart-table-head{
        display:none;
    }

    .cart-row{
        grid-template-columns:1fr auto;
        padding:18px;
    }

    .cart-product{
        grid-column:1/-1;
    }

    .cart-unit-price{
        display:none;
    }

    .cart-item-total{
        justify-self:end;
    }

    .cart-actions{
        flex-direction:column;
        gap:12px;
        align-items:stretch;
    }

    .cart-actions .btn{
        width:100%;
    }

    .cart-benefits .container{
        grid-template-columns:1fr;
    }

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

    .form-field.full{
        grid-column:auto;
    }

    .checkout-card{
        padding:18px;
    }

    .shipping-option,
    .payment-option{
        gap:8px;
        padding:12px;
    }

}


@media(max-width:400px){

    .shop-product-grid{
        grid-template-columns:1fr;
    }

    .shop-product-image{
        height:220px;
    }

}

/* =========================================================
   BOOF — SERVICES PAGE
========================================================= */

.services-hero {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    background:
        radial-gradient(circle at 85% 30%, rgba(48, 138, 255, .14), transparent 30%),
        linear-gradient(135deg, #f4f9ff 0%, #ffffff 60%);
}

.services-hero-inner {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    align-items: center;
    gap: 70px;
}

.services-hero-content {
    max-width: 680px;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #1477d4;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .4px;
    margin-bottom: 18px;
}

.eyebrow::before {
    content: "";
    width: 26px;
    height: 2px;
    background: #1477d4;
}

.services-hero h1 {
    margin: 0 0 22px;
    color: #092c4c;
    font-size: clamp(25px, 5vw, 46px);
    line-height: 1.15;
    font-weight: 900;
}

.services-hero p {
    max-width: 600px;
    margin: 0 0 32px;
    color: #5c7185;
    font-size: 18px;
    line-height: 2;
}

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

.secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 24px;
    border: 1px solid #d7e5f2;
    border-radius: 14px;
    color: #164466;
    background: #fff;
    text-decoration: none;
    font-weight: 800;
    transition: .25s ease;
}

.secondary-button:hover {
    border-color: #1682e8;
    color: #1682e8;
    transform: translateY(-2px);
}

.services-hero-visual {
    position: relative;
    min-height: 470px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-circle {
    position: absolute;
    width: 390px;
    height: 390px;
    border-radius: 50%;
    background: linear-gradient(145deg, #dcefff, #edf7ff);
    box-shadow:
        inset 0 0 0 18px rgba(255,255,255,.7),
        0 30px 80px rgba(19, 109, 184, .12);
}

.bird-placeholder {
    position: relative;
    z-index: 2;
    width: 250px;
    height: 250px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255,255,255,.72);
    font-size: 145px;
    box-shadow: 0 25px 60px rgba(14, 83, 136, .13);
}

.hero-badge {
    position: absolute;
    z-index: 3;
    top: 60px;
    right: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 16px 22px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(15, 77, 124, .15);
}

.hero-badge strong {
    color: #0878d1;
    font-size: 20px;
}

.hero-badge span {
    margin-top: 3px;
    color: #7b8d9d;
    font-size: 11px;
}


/* SERVICES */

.services-section {
    padding: 110px 0;
    background: #fff;
}

.section-heading {
    max-width: 720px;
    margin-bottom: 55px;
}

.section-heading.center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.section-heading.center .eyebrow {
    justify-content: center;
}

.section-heading h2 {
    margin: 0 0 15px;
    color: #092c4c;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.35;
}

.section-heading p {
    margin: 0;
    color: #718497;
    font-size: 17px;
    line-height: 1.9;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.service-card {
    position: relative;
    overflow: hidden;
    padding: 30px 26px;
    min-height: 330px;
    border: 1px solid #e4eef6;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 40px rgba(21, 87, 135, .05);
    transition: .3s ease;
}

.service-card:hover {
    transform: translateY(-8px);
    border-color: #b9dcf6;
    box-shadow: 0 25px 55px rgba(21, 87, 135, .12);
}

.service-card.featured {
    border-color: #b8dcf8;
    background:
        linear-gradient(145deg, #f5fbff, #ffffff);
}

.service-number {
    position: absolute;
    top: 20px;
    left: 20px;
    color: #dcebf6;
    font-size: 48px;
    line-height: 1;
    font-weight: 900;
}

.service-icon {
    position: relative;
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    margin-bottom: 28px;
    border-radius: 18px;
    background: #eaf6ff;
    font-size: 28px;
}

.service-card h3 {
    position: relative;
    margin: 0 0 12px;
    color: #123d5d;
    font-size: 21px;
}

.service-card p {
    margin: 0 0 22px;
    color: #74889a;
    font-size: 14px;
    line-height: 1.9;
}

.service-card a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0878d1;
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
}

.service-card a span {
    transition: .2s ease;
}

.service-card:hover a span {
    transform: translateX(-5px);
}


/* PROCESS */

.service-process {
    padding: 105px 0;
    background: #f5faff;
}

.process-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 18px;
}

.process-item {
    text-align: center;
}

.process-icon {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: #fff;
    color: #0878d1;
    border: 2px solid #d8ebfa;
    font-size: 16px;
    font-weight: 900;
    box-shadow: 0 12px 30px rgba(20, 103, 165, .08);
}

.process-item h3 {
    margin: 0 0 10px;
    color: #143f5f;
    font-size: 18px;
}

.process-item p {
    margin: 0;
    color: #72879a;
    font-size: 13px;
    line-height: 1.8;
}

.process-line {
    height: 1px;
    width: 55px;
    background: #c8dfef;
}


/* WHY BOOF */

.why-boof {
    padding: 110px 0;
    background: #fff;
}

.why-boof-grid {
    display: grid;
    grid-template-columns: 1fr .8fr;
    gap: 90px;
    align-items: center;
}

.why-boof-content h2 {
    max-width: 620px;
    margin: 0 0 20px;
    color: #092c4c;
    font-size: clamp(25px, 4vw, 32px);
    line-height: 1.4;
}

.why-boof-content > p {
    max-width: 620px;
    color: #718497;
    line-height: 2;
}

.benefit-list {
    margin-top: 35px;
    display: grid;
    gap: 24px;
}

.benefit {
    display: flex;
    gap: 16px;
}

.benefit-icon {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #0878d1;
    background: #eaf6ff;
    font-weight: 900;
}

.benefit strong {
    display: block;
    margin-bottom: 5px;
    color: #153f5d;
}

.benefit p {
    margin: 0;
    color: #788b9c;
    font-size: 13px;
    line-height: 1.8;
}

.why-boof-card {
    position: relative;
    min-height: 500px;
    padding: 28px;
    overflow: hidden;
    border-radius: 32px;
    background:
        radial-gradient(circle at 50% 35%, #ffffff 0%, #e4f4ff 32%, #cbe9fb 100%);
    box-shadow: 0 30px 80px rgba(20, 104, 167, .13);
}

.why-card-top {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    color: #1179c8;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 1px;
}

.why-card-bird {
    position: absolute;
    inset: 80px 0 100px;
    display: grid;
    place-items: center;
    font-size: 190px;
}

.why-card-bottom {
    position: absolute;
    right: 28px;
    bottom: 28px;
    left: 28px;
    padding: 20px;
    border-radius: 20px;
    background: rgba(255,255,255,.75);
    backdrop-filter: blur(12px);
}

.why-card-bottom strong {
    display: block;
    color: #123e5d;
    font-size: 20px;
}

.why-card-bottom p {
    margin: 5px 0 0;
    color: #708598;
    font-size: 13px;
}


/* CTA */

.services-cta {
    padding: 0 0 110px;
    background: #fff;
}

.cta-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    padding: 55px 60px;
    border-radius: 30px;
    background:
        radial-gradient(circle at 85% 20%, rgba(255,255,255,.15), transparent 25%),
        linear-gradient(135deg, #0878d1, #07599e);
    box-shadow: 0 25px 70px rgba(8, 100, 173, .2);
}

.cta-box .eyebrow {
    color: #d8efff;
}

.cta-box .eyebrow::before {
    background: #d8efff;
}

.cta-box h2 {
    max-width: 650px;
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.4;
}

.cta-box p {
    margin: 0;
    color: rgba(255,255,255,.78);
    line-height: 1.9;
}

.cta-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-shrink: 0;
}

.primary-button.light {
    color: #0878d1;
    background: #fff;
}

.cta-phone {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
}


/* RESPONSIVE */

@media (max-width: 1100px) {

    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .services-hero-inner {
        gap: 35px;
    }

    .process-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
    }

    .process-line {
        display: none;
    }

}


@media (max-width: 800px) {

    .services-hero {
        padding: 70px 0;
    }

    .services-hero-inner,
    .why-boof-grid {
        grid-template-columns: 1fr;
    }

    .services-hero-content {
        text-align: center;
        margin: auto;
    }

    .services-hero p {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-actions {
        justify-content: center;
    }

    .services-hero-visual {
        min-height: 390px;
    }

    .hero-circle {
        width: 310px;
        height: 310px;
    }

    .bird-placeholder {
        width: 200px;
        height: 200px;
        font-size: 110px;
    }

    .why-boof-grid {
        gap: 45px;
    }

    .cta-box {
        flex-direction: column;
        align-items: flex-start;
        padding: 40px 30px;
    }

}


@media (max-width: 560px) {

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

    .services-section,
    .service-process,
    .why-boof {
        padding: 75px 0;
    }

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

    .services-hero h1 {
        font-size: 40px;
    }

    .hero-badge {
        right: 0;
    }

    .cta-actions {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .cta-actions a {
        text-align: center;
    }

}


/* =========================================================
   BOOF — CONTACT PAGE
========================================================= */

.contact-info-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:50px;
}

.contact-info-card{
    display:flex;
    align-items:center;
    gap:14px;
    padding:22px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:20px;
    box-shadow:var(--shadow);
}

.contact-info-card strong{
    display:block;
    color:var(--dark);
    font-size:13px;
    margin-bottom:4px;
}

.contact-info-card span,
.contact-info-card a{
    display:block;
    color:var(--muted);
    font-size:11px;
}

.contact-layout{
    display:grid;
    grid-template-columns:1fr 360px;
    gap:25px;
    align-items:start;
}

.contact-map-box{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    text-align:center;
    padding:40px 20px;
    min-height:220px;
    background:var(--primary-light);
    border-radius:23px;
    color:var(--primary-dark);
    font-size:12px;
}

.contact-map-box i{
    font-size:30px;
    color:var(--primary);
}

.contact-hours-list{
    display:grid;
    gap:10px;
    margin-top:15px;
}

.contact-hours-list > div{
    display:flex;
    justify-content:space-between;
    font-size:11px;
    color:var(--muted);
}

.contact-hours-list strong{
    color:var(--dark);
}

@media(max-width:900px){

    .contact-info-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .contact-layout{
        grid-template-columns:1fr;
    }

}

@media(max-width:560px){

    .contact-info-grid{
        grid-template-columns:1fr;
    }

}


/* =========================================================
   BOOF — BLOG PAGE
========================================================= */

.blog-filters{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:center;
    margin-bottom:45px;
}

.blog-filter{
    padding:10px 22px;
    border-radius:50px;
    background:var(--primary-light);
    color:var(--primary-dark);
    font-family:inherit;
    font-size:12px;
    font-weight:700;
    cursor:pointer;
    transition:.3s;
}

.blog-filter.active,
.blog-filter:hover{
    background:var(--primary);
    color:#fff;
}

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

.blog-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:24px;
    overflow:hidden;
    box-shadow:var(--shadow);
    transition:.3s;
}

.blog-card.hidden{
    display:none;
}

.blog-card:hover{
    transform:translateY(-6px);
}

.blog-card img{
    width:100%;
    height:200px;
    object-fit:cover;
    object-position:top;
}

.blog-card-body{
    padding:22px;
}

.blog-tag{
    display:inline-block;
    padding:4px 12px;
    border-radius:20px;
    background:var(--primary-light);
    color:var(--primary-dark);
    font-size:10px;
    font-weight:700;
    margin-bottom:12px;
}

.blog-card h3{
    color:var(--dark);
    margin-bottom:10px;
    font-size:16px;
    line-height:1.6;
}

.blog-card p{
    color:var(--muted);
    font-size:12px;
    margin-bottom:18px;
}

.blog-meta{
    display:flex;
    justify-content:space-between;
    font-size:10px;
    color:var(--muted);
    border-top:1px solid var(--border);
    padding-top:14px;
}

.blog-meta span{
    display:flex;
    align-items:center;
    gap:5px;
}

.blog-newsletter{
    margin-top:70px;
    background:linear-gradient(135deg,#0879c9,#0ca9e9);
    border-radius:30px;
    padding:55px 40px;
    text-align:center;
    color:#fff;
}

.blog-newsletter h3{
    font-size:24px;
    margin-bottom:10px;
}

.blog-newsletter p{
    color:#e4f8ff;
    font-size:12px;
    margin-bottom:25px;
}

.blog-newsletter-form{
    display:flex;
    gap:10px;
    max-width:420px;
    margin:auto;
}

.blog-newsletter-form input{
    flex:1;
    padding:14px 18px;
    border-radius:14px;
    border:none;
    font-family:inherit;
    font-size:12px;
}

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

@media(max-width:600px){
    .blog-grid{
        grid-template-columns:1fr;
    }
    .blog-newsletter-form{
        flex-direction:column;
    }
}


/* =========================================================
   BOOF — AUTH PAGES (login / register)
========================================================= */

.auth-section{
    padding:80px 0;
    display:flex;
    justify-content:center;
}

.auth-card{
    width:100%;
    max-width:440px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:28px;
    padding:45px 38px;
    box-shadow:var(--shadow);
    text-align:center;
}

.auth-card .logo-icon{
    margin:0 auto 18px;
}

.auth-card h1{
    font-size:23px;
    color:var(--dark);
    margin-bottom:8px;
}

.auth-card > p{
    color:var(--muted);
    font-size:12px;
    margin-bottom:32px;
}

.auth-card form{
    display:grid;
    gap:18px;
    text-align:right;
}

.auth-options{
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:11px;
    margin-top:-6px;
}

.auth-options label{
    display:flex;
    align-items:center;
    gap:6px;
    color:var(--muted);
}

.auth-options a{
    color:var(--primary);
    font-weight:700;
}

.auth-card .btn{
    width:100%;
    margin-top:6px;
}

.auth-footer-link{
    margin-top:26px;
    font-size:12px;
    color:var(--muted);
}

.auth-footer-link a{
    color:var(--primary);
    font-weight:700;
}

@media(max-width:520px){
    .auth-card{
        padding:35px 22px;
        border-radius:22px;
    }
}


/* =========================================================
   BOOF — PROFILE PAGE
========================================================= */

.profile-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:25px;
    align-items:start;
}

.profile-sidebar{
    background:#fff;
    border:1px solid var(--border);
    border-radius:24px;
    padding:28px;
    box-shadow:var(--shadow);
    text-align:center;
}

.profile-avatar{
    width:88px;
    height:88px;
    border-radius:50%;
    background:var(--primary-light);
    display:grid;
    place-items:center;
    margin:0 auto 14px;
    font-size:32px;
    color:var(--primary);
}

.profile-sidebar h3{
    color:var(--dark);
    font-size:16px;
    margin-bottom:4px;
}

.profile-sidebar span{
    color:var(--muted);
    font-size:11px;
}

.profile-nav{
    display:grid;
    gap:6px;
    margin-top:26px;
    text-align:right;
}

.profile-nav a{
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 14px;
    border-radius:14px;
    color:var(--text);
    font-size:13px;
    font-weight:700;
    transition:.25s;
}

.profile-nav a.active,
.profile-nav a:hover{
    background:var(--primary-light);
    color:var(--primary);
}

.profile-nav a.logout{
    color:#ff5c73;
    margin-top:10px;
    border-top:1px solid var(--border);
    padding-top:16px;
    border-radius:0;
}

.profile-content{
    display:grid;
    gap:22px;
}

.order-list{
    display:grid;
    gap:12px;
}

.order-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:16px 18px;
    border:1px solid var(--border);
    border-radius:16px;
    flex-wrap:wrap;
}

.order-row strong{
    display:block;
    color:var(--dark);
    font-size:13px;
    margin-bottom:3px;
}

.order-row small{
    color:var(--muted);
    font-size:10px;
}

.order-status{
    padding:5px 14px;
    border-radius:20px;
    font-size:10px;
    font-weight:700;
}

.order-status.delivered{
    background:#e9fbef;
    color:#1c9a4b;
}

.order-status.pending{
    background:var(--accent-light);
    color:var(--accent-dark);
}

.order-status.processing{
    background:var(--primary-light);
    color:var(--primary-dark);
}

@media(max-width:900px){
    .profile-layout{
        grid-template-columns:1fr;
    }
}

@media(max-width:560px){
    .order-row{
        flex-direction:column;
        align-items:flex-start;
    }
}


/* =========================================================
   BOOF — BLOG POST (single article) PAGE
========================================================= */

.blog-post-layout{
    display:grid;
    grid-template-columns:1fr 320px;
    gap:35px;
    align-items:start;
}

.blog-post-main{
    background:#fff;
    border:1px solid var(--border);
    border-radius:24px;
    padding:35px;
    box-shadow:var(--shadow);
}

.blog-post-image{
    width:100%;
    height:320px;
    object-fit:cover;
    object-position:top;
    border-radius:18px;
    margin-bottom:25px;
}

.blog-post-main h1{
    font-size:26px;
    color:var(--dark);
    margin:14px 0;
    line-height:1.8;
}

.blog-post-meta{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    color:var(--muted);
    font-size:11px;
    margin-bottom:28px;
    padding-bottom:22px;
    border-bottom:1px solid var(--border);
}

.blog-post-meta span{
    display:flex;
    align-items:center;
    gap:5px;
}

.blog-post-body{
    font-size:14px;
    line-height:2.2;
    color:var(--text);
}

.blog-post-body p{
    margin-bottom:18px;
}

.blog-post-body h3{
    color:var(--dark);
    font-size:17px;
    margin:32px 0 14px;
    padding-top:24px;
    border-top:1px solid var(--border);
}

.blog-post-body h3:first-child{
    margin-top:0;
    padding-top:0;
    border-top:none;
}

.blog-post-body h4{
    color:var(--primary-dark);
    font-size:14px;
    margin:20px 0 6px;
}

.blog-post-body ul{
    margin:0 0 20px;
    padding-right:22px;
    display:grid;
    gap:8px;
}

.blog-post-body li{
    list-style:disc;
}

.blog-post-body strong{
    color:var(--dark);
}

.blog-post-faq-item{
    padding:16px 0;
    border-bottom:1px solid var(--border);
}

.blog-post-faq-item:last-child{
    border-bottom:none;
}

.blog-post-faq-item h4{
    margin-top:0;
}

.blog-post-back{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--primary);
    font-size:12px;
    font-weight:700;
    margin-bottom:20px;
}

.blog-post-sidebar{
    display:grid;
    gap:20px;
    position:sticky;
    top:100px;
}

.sidebar-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:20px;
    padding:22px;
    box-shadow:var(--shadow);
}

.sidebar-card h4{
    color:var(--dark);
    margin-bottom:16px;
    font-size:14px;
}

.related-post{
    display:flex;
    gap:12px;
    align-items:center;
    padding:11px 0;
    border-bottom:1px solid var(--border);
}

.related-post:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.related-post:first-child{
    padding-top:0;
}

.related-post img{
    width:58px;
    height:58px;
    object-fit:cover;
    border-radius:10px;
    flex-shrink:0;
}

.related-post strong{
    display:block;
    font-size:12px;
    color:var(--dark);
    line-height:1.7;
    font-weight:700;
}

.sidebar-category-list{
    display:grid;
    gap:8px;
}

.sidebar-category-list a{
    display:flex;
    justify-content:space-between;
    padding:9px 12px;
    border-radius:10px;
    font-size:12px;
    color:var(--text);
    font-weight:600;
}

.sidebar-category-list a:hover{
    background:var(--primary-light);
    color:var(--primary);
}

@media(max-width:900px){

    .blog-post-layout{
        grid-template-columns:1fr;
    }

    .blog-post-sidebar{
        position:static;
    }

    .blog-post-main{
        padding:22px;
    }

    .blog-post-image{
        height:220px;
    }

}

/* جدول تغذیه پرندگان */

.food-table-wrapper {
    width: 100%;
    overflow-x: auto;
    margin: 30px 0;
    border-radius: 14px;
    border: 1px solid var(--border);
}

.food-table {
    width: 100%;
    min-width: 580px;
    border-collapse: collapse;
    direction: rtl;
    text-align: center;
    background: #fff;
    font-family: 'Vazirmatn', sans-serif;
    font-size: 13px;
    line-height: 2;
}

.food-table th {
    background: #245b68;
    color: #fff;
    padding: 15px 10px;
    font-weight: 800;
}

.food-table td {
    padding: 14px 10px;
    border: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
}

.food-table tbody tr:nth-child(even) {
    background: #f1f8fb;
}

.food-table tbody tr:hover {
    background: #e5f4fb;
}

@media(max-width:600px) {
    .food-table {
        font-size: 11px;
    }

    .food-table th,
    .food-table td {
        padding: 10px 7px;
    }
}