
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    
}

html, body {
    height: 100%;
    overflow: hidden; 
    
}


body {
    font-family: 'Poppins', sans-serif;
    background-color: #fde2ed; /* Light pink background */
    color: #000000; /* Dark text */
    overflow-x: hidden;
    
    
}

h1, h2 {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
}

a {
    text-decoration: none;
}

button {
    background: transparent;
    border: none;
    cursor: pointer;
}

/* ===== HEADER / NAVIGATION ===== */
.header {
    background-color: #e182a4; 
    padding: 1rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    position: relative;
}

.logo img {
    height: 80px;
}

/* BURGER ICON - nakatago muna */
.burger-btn {
    display: none;
    color: #000000;
    transition: transform 0.2s ease;
}

.burger-icon {
    width: 28px;
    height: 28px;
}

.burger-btn.active {
    transform: rotate(90deg);
}

/* NAV LINKS */
.nav-links {
    display: flex;
    gap: 2.5rem;
    align-items: center;
}

.nav-link {
    color: #000000;
    font-size: 1.15rem; /* Laki ng font sa nav */
    font-weight: 500;
    position: relative;
    transition: all 0.3s ease;
    padding: 0.5rem 0;
}

/* Hover + Active Effects (lahat ng device) */
.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #ffffff;
    transition: width 0.3s ease;
}

.nav-link:hover::after,
.nav-link.active::after {
    width: 100%;
}

.nav-link:hover,
.nav-link:active {
    opacity: 0.9;
    transform: translateY(-2px);
}

.nav-link:active {
    transform: translateY(0);
}

/* ICONS (Cart & Person lang) */
.icons {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}

.icon-btn {
    color: #ffffff;
    transition: all 0.2s ease;
    padding: 0.4rem;
    border-radius: 50%;
}

.icon-svg {
    width: 24px;
    height: 24px;
}

.icon-btn:hover {
    transform: scale(1.15);
    background-color: rgba(255,255,255,0.2);
}

.icon-btn:active {
    transform: scale(0.95);
    background-color: rgba(255,255,255,0.3);
}

/* ===== HERO SECTION ===== */
.hero {
    min-height: calc(100vh - 96px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

.hero-text {
    max-width: 550px;
    margin-bottom: 50px;
}

.hero-text h1 {
    font-size: 5rem;
    line-height: 1.1;
    margin-bottom: 0.8rem;
}

.hero-text h2 {
    font-size: 2rem;
    font-weight: 500;
    opacity: 0.85;
    margin-bottom: 1.5rem;
}

.hero-text p {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 2rem;
    opacity: 0.8;
}

.shop-btn {
    display: inline-block;
    background-color: #000000;
    color: #ffffff;
    font-weight: 600;
    padding: 0.8rem 2.2rem;
    border-radius: 50px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.shop-btn:hover {
    transform: translateY(-4px);
    color: #000000;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    background-color: #e182a4;
}

.shop-btn:active {
    transform: translateY(0);
}


.hero-img img {
    margin-top: -50px;
    height: 450px;
    width: 380px;
    margin-right: 100px;
}

/* ===== MEDIA QUERIES — EKSAKTO SA SUCKET NA IBINIGAY MO ===== */

/*  CELLPHONE: 320px — 480px */
@media (min-width: 320px) and (max-width: 480px) {

body {
    overflow-y: auto; /* Pwede mag-scroll pababa */
}

    .burger-btn {
        display: block; /* lalabas ang burger */
    }

    .nav-links {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: #E88EA7;
        flex-direction: column;
        gap: 1rem;
        padding: 1rem 0;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        transform: translateY(-150%);
        opacity: 0;
        visibility: hidden;
        transition: all 0.4s ease;
        z-index: 99;
    }

    /* Kapag pinindot ang burger, lalabas ang nav */
    .nav-links.show {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    .nav-link {
        font-size: 1.2rem;
        padding: 0.7rem 0;
        width: 100%;
        text-align: center;
    }

    .logo img {
        height: 60px;
        
    }

    .hero {
        flex-direction: column;
        text-align: center;
        gap: 2rem;
        padding: 1.5rem 1rem;
    }

    .hero-text h1 {
        font-size: 2.8rem;
    }

    .hero-text h2 {
        font-size: 1.3rem;
    }

    .hero-img img {
        width: 240px;
        margin-left: 100px;
    }

    .icon-svg {
        width: 20px;
        height: 20px;
    }
}

/*  TABLET: 481px — 768px */
@media (min-width: 481px) and (max-width: 768px) {

    body {
    overflow-y: auto; /* Pwede mag-scroll pababa */
}

    .burger-btn {
        display: none; /* wala nang burger */
    }

    .nav-links {
        display: flex;
        gap: 1.8rem;
    }

    .nav-link {
        font-size: 1.2rem; /* sakto laki ng font */
    }

    .logo img {
        height: 70px;
    }

    .hero {
        padding: 2rem 1.5rem;
        gap: 1.5rem;
    }

    .hero-text h1 {
        font-size: 4rem;
    }

    .hero-text h2 {
        font-size: 1.6rem;
    }

    .hero-img img {
        width: 300px;
    }

    
}

/*  DESKTOP: 769px — 1201px */
@media (min-width: 769px) and (max-width: 1201px) {
    .header {
        padding: 1.2rem 3rem;
    }

    .nav-link {
        font-size: 1.3rem; /* mas malaki sa desktop */
    }

    .hero {
        padding: 3rem 2rem;
        max-width: 1100px;
    }

    .hero-text h1 {
        font-size: 5.2rem;
    }

    .hero-text h2 {
        font-size: 2.2rem;
    }

    .hero-img img {
        width: 380px;
    }
}











/*----------------------------------------PRODUCTS CSS--------------------------------------------*/








/* products.css */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:'Poppins',sans-serif;
}

body{
  background:#fde2ed;
  overflow:hidden;
}

/* HEADER */

.prod_header{
  width:100%;
  height:85px;
  background-color: #e182a4;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 4%;
  position:sticky;
  top:0;
  z-index:1000;
}

.prod_logo h2{
  color:#fff;
  font-size:28px;
  font-weight:700;
}

.prod_navbar{
  display:flex;
  gap:35px;
}

.prod_navbar a{
  text-decoration:none;
  color:#222;
  font-weight:500;
  font-size:18px;
  transition:.3s;
}

.prod_navbar a:hover,
.prod_active{
  color:#fff;
}

.prod_nav_icons{
  display:flex;
  gap:18px;
  font-size:24px;
  cursor:pointer;
  color:#fff;
}

/* MAIN */

.prod_main_wrapper{
  display:grid;
  grid-template-columns:280px 1fr 320px;
  gap:20px;
  padding:20px;
  height:calc(100vh - 85px);
}

/* STOCK MANAGER */

.prod_stock_manager{
  background:#fff;
  border-radius:20px;
  padding:20px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  box-shadow:0 4px 15px rgba(0,0,0,.1);
}

.prod_stock_top h2{
  font-size:28px;
  margin-bottom:5px;
}

.prod_stock_top p{
  color:#777;
  margin-bottom:20px;
}

.prod_stock_list{
  overflow-y:auto;
  padding-right:5px;
}

.prod_stock_card{
  background:#fdf2f6;
  padding:15px;
  border-radius:15px;
  margin-bottom:15px;
  border:1px solid #eee;
}

.prod_stock_card h3{
  font-size:16px;
  margin-bottom:10px;
}

.prod_stock_row{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.prod_stock_controls{
  display:flex;
  align-items:center;
  gap:10px;
}

.prod_stock_number{
  font-weight:600;
}

.prod_refill_btn{
  border:none;
  background:#17a34a;
  color:#fff;
  width:35px;
  height:35px;
  border-radius:10px;
  cursor:pointer;
  font-size:20px;
  transition:.3s;
}

.prod_refill_btn:hover{
  background:#11833a;
}

/* PRODUCTS SECTION */

.prod_products_section{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  height:100%;
}

/* TITLE */

.prod_title_area{
  padding:5px 10px 20px;
  flex-shrink:0;
}

.prod_title_area h1{
  text-align:center;
  font-size:46px;
  font-weight:800;
  color:#111;
  line-height:1.2;
}

/* PRODUCTS GRID */

.prod_products_grid{
  flex:1;
  overflow-y:auto;

  display:grid;

  /* MAS MALINIS NA LAYOUT */
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));

  gap:22px;

  padding:5px 10px 20px;

  align-content:start;
}

/* PRODUCT CARD */

.prod_product_card{
  background:#fff;

  border-radius:22px;

  padding:15px;

  display:flex;
  flex-direction:column;

  min-height:480px;

  border:1px solid rgba(0,0,0,0.06);

  box-shadow:
    0 8px 25px rgba(0,0,0,0.08);

  transition:0.3s ease;
}

.prod_product_card:hover{
  transform:translateY(-6px);
  box-shadow:
    0 12px 30px rgba(0,0,0,0.12);
}

/* IMAGE */

.prod_product_img{
  width:100%;
  height:240px;

  object-fit:cover;

  border-radius:18px;

  margin-bottom:15px;
}

/* NAME */

.prod_product_name{
  font-size:22px;
  font-weight:700;
  color:#111;

  line-height:1.3;

  margin-bottom:10px;

  min-height:58px;
}

/* PRICE */

.prod_product_price{
  font-size:22px;
  font-weight:700;
  color:#d83b78;

  margin-bottom:8px;
}

/* STOCK */

.prod_product_stock{
  font-size:15px;
  font-weight:600;

  color:#444;

  margin-bottom:10px;
}

/* DESCRIPTION */

.prod_product_desc{
  color:#666;

  font-size:14px;

  line-height:1.6;

  flex:1;

  margin-bottom:20px;
}

/* BUTTON */

.prod_add_btn{
  width:100%;

  border:none;

  padding:15px;

  border-radius:50px;

  background:#111;

  color:#fff;

  font-size:16px;
  font-weight:600;

  cursor:pointer;

  transition:0.3s;
}

.prod_add_btn:hover{
  background:#d83b78;
  transform:scale(1.02);
}

.prod_out_stock{
  background:#b8b8b8 !important;
  cursor:not-allowed;
}

/* SCROLL */

.prod_products_grid::-webkit-scrollbar{
  width:8px;
}

.prod_products_grid::-webkit-scrollbar-thumb{
  background:#d97b9d;
  border-radius:50px;
}
/* CART */

.prod_cart_section{
  background:#fff;
  border-radius:20px;
  padding:20px;
  display:flex;
  flex-direction:column;
  box-shadow:0 4px 15px rgba(0,0,0,.1);
}

.prod_cart_top{
  display:flex;
  justify-content:space-between;
  margin-bottom:20px;
}

.prod_cart_items{
  flex:1;
  overflow-y:auto;
}

.prod_cart_item{
  display:flex;
  gap:12px;
  margin-bottom:15px;
  background:#fff3f7;
  padding:10px;
  border-radius:15px;
}

.prod_cart_item img{
  width:70px;
  height:70px;
  border-radius:10px;
  object-fit:cover;
}

.prod_cart_details{
  flex:1;
}

.prod_cart_details h4{
  font-size:15px;
}

.prod_remove_btn{
  border:none;
  background:red;
  color:#fff;
  width:28px;
  height:28px;
  border-radius:50%;
  cursor:pointer;
}

.prod_cart_footer{
  margin-top:15px;
}

.prod_subtotal{
  display:flex;
  justify-content:space-between;
  margin-bottom:15px;
  font-size:18px;
}

.prod_checkout_btn{
  width:100%;
  border:none;
  padding:16px;
  border-radius:50px;
  background:#000;
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  transition:.3s;
}

.prod_checkout_btn:hover{
  background:#d83b78;
}

/* SCROLLBAR */

.prod_products_grid::-webkit-scrollbar,
.prod_stock_list::-webkit-scrollbar,
.prod_cart_items::-webkit-scrollbar{
  width:7px;
}

.prod_products_grid::-webkit-scrollbar-thumb,
.prod_stock_list::-webkit-scrollbar-thumb,
.prod_cart_items::-webkit-scrollbar-thumb{
  background:#d97b9d;
  border-radius:50px;
}

.prod_burger_btn{
  display:none;
  font-size:30px;
  color:#fff;
  cursor:pointer;
  user-select:none;
}

/* ========================= */
/* TABLET RESPONSIVE */
/* 481px - 768px */
/* ========================= */

@media (max-width:768px){

  body{
    overflow:auto;
    background:#f8dfe9;
  }

  /* HEADER */

  .prod_header{
    height:auto;
    flex-direction:column;
    gap:15px;
    padding:18px 15px;
  }

  .prod_logo h2{
    font-size:24px;
  }

  .prod_navbar{
    width:100%;
    justify-content:center;
    flex-wrap:wrap;
    gap:18px;
  }

  .prod_navbar a{
    font-size:15px;
  }

  .prod_nav_icons{
    font-size:22px;
  }

  /* MAIN LAYOUT */

  .prod_main_wrapper{
    grid-template-columns:1fr;
    gap:20px;
    height:auto;
    padding:15px;
  }

  /* STOCK MANAGER */

  .prod_stock_manager{
    border-radius:22px;
    padding:18px;
    order:1;
  }

  .prod_stock_top h2{
    font-size:24px;
  }

  .prod_stock_list{
    max-height:260px;
    overflow-y:auto;
    padding-right:5px;
  }

  .prod_stock_card{
    padding:14px;
  }

  /* PRODUCTS */

  .prod_products_section{
    order:2;
  }

  .prod_title_area{
    padding:0 5px 15px;
  }

  .prod_title_area h1{
    font-size:34px;
    line-height:1.3;
  }

  .prod_products_grid{
    overflow:visible;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

    padding:5px;
  }

  .prod_product_card{
    min-height:430px;
    border-radius:22px;
    padding:14px;
  }

  .prod_product_img{
    height:190px;
    border-radius:16px;
  }

  .prod_product_name{
    font-size:18px;
    min-height:50px;
  }

  .prod_product_price{
    font-size:19px;
  }

  .prod_product_stock{
    font-size:14px;
  }

  .prod_product_desc{
    font-size:13px;
  }

  .prod_add_btn{
    padding:13px;
    font-size:15px;
  }

  /* CART */

  .prod_cart_section{
    order:3;
    border-radius:22px;
    padding:18px;
  }

  .prod_cart_items{
    max-height:300px;
    overflow-y:auto;
  }

  .prod_cart_top h2{
    font-size:24px;
  }

  .prod_checkout_btn{
    padding:15px;
    font-size:16px;
  }

}


/* ========================= */
/* MOBILE RESPONSIVE */
/* 320px - 480px */
/* ========================= */

@media (max-width:480px){

  body{
    overflow:auto;
  }

  /* HEADER */

  .prod_header{
    padding:15px 10px;
    gap:14px;
  }

  .prod_logo h2{
    font-size:22px;
  }

  .prod_navbar{
    gap:12px;
  }

  .prod_navbar a{
    font-size:13px;
  }

  .prod_nav_icons{
    font-size:20px;
    gap:14px;
  }

  /* MAIN */

  .prod_main_wrapper{
    padding:10px;
    gap:15px;
  }

  /* STOCK MANAGER */

  .prod_stock_manager{
    padding:15px;
    border-radius:20px;
  }

  .prod_stock_top h2{
    font-size:22px;
  }

  .prod_stock_top p{
    font-size:13px;
  }

  .prod_stock_list{
    max-height:220px;
  }

  .prod_stock_card{
    padding:12px;
    border-radius:15px;
  }

  .prod_stock_card h3{
    font-size:15px;
  }

  .prod_refill_btn{
    width:32px;
    height:32px;
    font-size:18px;
  }

  /* PRODUCTS */

  .prod_title_area{
    padding:0 0 10px;
  }

  .prod_title_area h1{
    font-size:26px;
    line-height:1.3;
  }

  .prod_products_grid{
    grid-template-columns:1fr;
    gap:16px;
    padding:0;
  }

  .prod_product_card{
    min-height:auto;
    padding:14px;
    border-radius:20px;
  }

  .prod_product_img{
    height:220px;
    border-radius:15px;
  }

  .prod_product_name{
    font-size:20px;
    min-height:auto;
  }

  .prod_product_price{
    font-size:20px;
  }

  .prod_product_stock{
    font-size:14px;
  }

  .prod_product_desc{
    font-size:13px;
    margin-bottom:15px;
  }

  .prod_add_btn{
    padding:14px;
    font-size:15px;
  }

  /* CART */

  .prod_cart_section{
    padding:15px;
    border-radius:20px;
  }

  .prod_cart_top{
    align-items:center;
  }

  .prod_cart_top h2{
    font-size:22px;
  }

  .prod_cart_items{
    max-height:280px;
  }

  .prod_cart_item{
    gap:10px;
    padding:10px;
  }

  .prod_cart_item img{
    width:60px;
    height:60px;
  }

  .prod_cart_details h4{
    font-size:14px;
  }

  .prod_cart_details p,
  .prod_cart_details strong{
    font-size:13px;
  }

  .prod_remove_btn{
    width:25px;
    height:25px;
    font-size:12px;
  }

  .prod_subtotal{
    font-size:16px;
  }

  .prod_checkout_btn{
    padding:14px;
    font-size:15px;
    border-radius:40px;
  }

}




/* ========================= */
/* BURGER MENU */
/* ========================= */

.prod_burger_btn{
  display:none;
  font-size:30px;
  color:#fff;
  cursor:pointer;
  user-select:none;
}

/* ========================= */
/* MOBILE NAV */
/* ========================= */

@media (max-width:768px){

  .prod_header{
    position:relative;
  }

  .prod_burger_btn{
    display:block;
    position:absolute;
    right:20px;
    top:20px;
    z-index:1001;
  }

  .prod_navbar{

    position:absolute;

    top:100%;

    left:0;

    width:100%;

    background:#f3a6c0;

    flex-direction:column;

    align-items:center;

    gap:0;

    overflow:hidden;

    max-height:0;

    transition:0.4s ease;

    box-shadow:0 10px 20px rgba(0,0,0,0.1);
  }

  .prod_navbar a{
    width:100%;
    text-align:center;
    padding:16px;
    border-top:1px solid rgba(255,255,255,0.2);
    font-size:15px;
  }

  /* ACTIVE MENU */

  .prod_navbar.prod_show_nav{
    max-height:500px;
    padding-bottom:10px;
  }

  /* ICONS */

  .prod_nav_icons{
    margin-top:10px;
  }

}





/*----------------------------------------REVIEW CSS--------------------------------------------*/




*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:'Poppins', sans-serif;
  background:#fff7fa;
  color:#222;
  overflow-y: auto;
}

/* ================= NAVBAR ================= */

.rev_header{
  width:100%;
  background-color: #e182a4;
  padding:18px 6%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:999;
}

.rev_logo img{
  width:90px;
}

.rev_navbar{
  display:flex;
  gap:45px;
}

.rev_navbar a{
  text-decoration:none;
  color:#222;
  font-size:18px;
  font-weight:500;
  position:relative;
}

.rev_navbar a:hover{
  color: #ffffff;
}

.rev_navbar a.rev_active{
  color:white;
  font-weight:700;
}

.rev_navbar a.rev_active::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-8px;
  width:100%;
  height:3px;
  background:white;
}

.rev_nav_icons{
  display:flex;
  align-items:center;
  gap:20px;
  color: white;
}

.rev_nav_icons button{
  border:none;
  background:none;
  color:white;
  font-size:24px;
  cursor:pointer;
  position:relative;
}

.rev_cart_btn span{
  position:absolute;
  top:-8px;
  right:-10px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#ff3e6c;
  color:white;
  font-size:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
}

/* ================= BURGER ================= */

.rev_burger{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}

.rev_burger span{
  width:28px;
  height:3px;
  background:rgb(253, 253, 253);
  border-radius:10px;
  transition:0.3s;
}

.rev_burger.rev_open span:nth-child(1){
  transform:rotate(45deg) translateY(11px);
}

.rev_burger.rev_open span:nth-child(2){
  opacity:0;
}

.rev_burger.rev_open span:nth-child(3){
  transform:rotate(-45deg) translateY(-11px);
}

/* ================= MAIN ================= */

.rev_main_wrapper{
  width:100%;
  padding:25px 4%;
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:30px;
}

.rev_heading_box h1{
  font-size:52px;
  margin-bottom:10px;
}

.rev_heading_box p{
  color:#555;
  font-size:18px;
  margin-bottom:30px;
}

/* ================= REVIEWS ================= */

.rev_reviews_grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.rev_review_card{
  background:white;
  border-radius:22px;
  padding:22px;
  box-shadow:0 4px 15px rgba(0,0,0,0.05);
  border:1px solid #f2d4de;
  overflow:hidden;
}

.rev_card_top{
  display:flex;
  justify-content:space-between;
  gap:15px;
  margin-bottom:18px;
}

.rev_user_info{
  display:flex;
  gap:14px;
}

.rev_user_info img{
  width:62px;
  height:62px;
  border-radius:50%;
  object-fit:cover;
}

.rev_user_info h3{
  font-size:22px;
}

.rev_stars{
  color:#ff4d88;
  margin-top:3px;
  font-size:22px;
}

.rev_date_menu{
  text-align:right;
  color:#666;
  font-size:14px;
}

.rev_date_menu i{
  margin-top:12px;
  cursor:pointer;
}

.rev_message{
  line-height:1.8;
  color:#333;
  margin-bottom:22px;

  /* HINDI LALAGPAS */
  overflow-wrap:break-word;
  word-wrap:break-word;
  word-break:break-word;
}

.rev_product_tag{
  display:flex;
  align-items:center;
  gap:15px;
}

.rev_product_tag img{
  width:65px;
  height:65px;
  border-radius:12px;
  object-fit:cover;
}

.rev_product_tag span{
  font-size:18px;
}

.rev_load_btn{
  margin:35px auto 0;
  display:flex;
  align-items:center;
  gap:10px;
  border:none;
  padding:18px 45px;
  border-radius:50px;
  background:white;
  border:2px solid #f58bb0;
  color:#ef6b95;
  font-size:17px;
  font-weight:600;
  cursor:pointer;
  transition:0.3s;
}

.rev_load_btn:hover{
  background:#ef6b95;
  color:white;
}

/* ================= SIDEBAR ================= */

.rev_sidebar{
  display:flex;
  flex-direction:column;
  gap:25px;
}

.rev_rating_box,
.rev_form_box{
  background:rgb(255, 255, 255);
  border-radius:24px;
  padding:25px;
  border:1px solid #f2d4de;
  box-shadow:0 4px 15px rgba(0,0,0,0.04);
}

.rev_rating_box h2,
.rev_form_box h2{
  margin-bottom:18px;
  font-size:36px;
}

.rev_big_rating{
  display:flex;
  align-items:center;
  gap:15px;
  margin-bottom:28px;
  flex-wrap:wrap;
}

.rev_big_rating h1{
  font-size:72px;
}

.rev_big_stars{
  color:#ff4d88;
  font-size:30px;
}

.rev_rating_rows{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.rev_bar_row{
  display:grid;
  grid-template-columns:80px 1fr 35px;
  align-items:center;
  gap:12px;
}

.rev_bar{
  height:10px;
  background:#ffffff;
  border-radius:50px;
  overflow:hidden;
}

.rev_bar div{
  height:100%;
  background:linear-gradient(to right,#ef6b95,#f58bb0);
  border-radius:50px;
}

/* ================= FORM ================= */

.rev_form_box p{
  color:#666;
  margin-bottom:22px;
  line-height:1.7;
}

.rev_form_box label{
  display:block;
  margin-bottom:10px;
  margin-top:18px;
  font-weight:600;
}

.rev_form_stars{
  display:flex;
  gap:12px;
  font-size:34px;
  color:#ff4d88;
  margin-bottom:20px;
}

.rev_form_stars i{
  cursor:pointer;
}

.rev_form_box textarea,
.rev_form_box input{
  width:100%;
  border:1px solid #e4c8d1;
  border-radius:14px;
  padding:16px;
  font-size:16px;
  font-family:'Poppins', sans-serif;
  outline:none;
}

.rev_form_box textarea{
  resize:none;
  min-height:150px;
}

.rev_submit_btn{
  width:100%;
  margin-top:22px;
  border:none;
  background:linear-gradient(to right,#ef6b95,#ff6f91);
  color:#ffffff;
  padding:18px;
  border-radius:50px;
  font-size:18px;
  font-weight:600;
  cursor:pointer;
  transition:0.3s;
}

.rev_submit_btn:hover{
  transform:translateY(-3px);
}

/* ================= TABLET ================= */

@media (max-width:768px){

  .rev_main_wrapper{
    grid-template-columns:1fr;
  }

  .rev_reviews_grid{
    grid-template-columns:1fr;
  }

  .rev_heading_box h1{
    font-size:38px;
  }

  .rev_rating_box h2,
  .rev_form_box h2{
    font-size:30px;
  }

}

/* ================= MOBILE ================= */

@media (max-width:480px){

  .rev_header{
    padding:18px 5%;
  }

  .rev_burger{
    display:flex;
  }

  .rev_navbar{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:rgb(245, 71, 152);
    flex-direction:column;
    align-items:center;
    padding:25px 0;
    gap:22px;

    opacity:0;
    pointer-events:none;
    transform:translateY(-10px);
    transition:0.3s;
  }

  .rev_navbar.rev_show{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .rev_navbar a{
    color:#222;
    font-size:18px;
  }

  .rev_nav_icons{
    display:none;
  }

  .rev_heading_box h1{
    font-size:30px;
  }

  .rev_heading_box p{
    font-size:15px;
  }

  .rev_card_top{
    flex-direction:column;
  }

  .rev_user_info h3{
    font-size:18px;
  }

  .rev_stars{
    font-size:18px;
  }

  .rev_product_tag span{
    font-size:15px;
  }

  .rev_big_rating h1{
    font-size:48px;
  }

  .rev_big_stars{
    font-size:20px;
  }

  .rev_form_stars{
    font-size:28px;
  }

  .rev_load_btn{
    width:100%;
    justify-content:center;
  }

}





/*--------------------------------------About css--------------------------------------------*/


*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:'Poppins', sans-serif;
  background:#fde2ed;
  color:#222;
  overflow-x:hidden;
}

/* ================= NAVBAR ================= */

.abt_header{
  width:100%;
  padding:18px 6%;
background-color: #e182a4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:999;
}

.abt_logo img{
  width:90px;
}

.abt_navbar{
  display:flex;
  gap:45px;
}

.abt_navbar a{
  text-decoration:none;
  color:#222;
  font-size:18px;
  font-weight:500;
  position:relative;
}

.abt_navbar a.abt_active{
  color:white;
  font-weight:700;
}

.abt_navbar a.abt_active::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-8px;
  width:100%;
  height:3px;
  background:white;
}

.abt_nav_icons{
  display:flex;
  align-items:center;
  gap:18px;
}

.abt_nav_icons button{
  border:none;
  background:none;
  color:white;
  font-size:24px;
  cursor:pointer;
  position:relative;
}

.abt_cart_btn span{
  position:absolute;
  top:-8px;
  right:-10px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#ff4375;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  color:white;
  font-weight:600;
}

/* ================= BURGER ================= */

.abt_burger{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}

.abt_burger span{
  width:28px;
  height:3px;
  background:white;
  border-radius:20px;
  transition:0.3s;
}

.abt_burger.abt_open span:nth-child(1){
  transform:rotate(45deg) translateY(11px);
}

.abt_burger.abt_open span:nth-child(2){
  opacity:0;
}

.abt_burger.abt_open span:nth-child(3){
  transform:rotate(-45deg) translateY(-11px);
}

/* ================= HERO ================= */

.abt_hero_section{
  width:100%;
  padding:70px 6%;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.abt_small_title{
  color:#ef6b95;
  font-weight:700;
  letter-spacing:1px;
}

.abt_hero_text h1{
  font-size:70px;
  line-height:1.2;
  margin:18px 0 25px;
}

.abt_hero_text h1 span{
  color:#ef6b95;
}

.abt_hero_text p{
  font-size:18px;
  color:#444;
  line-height:1.9;
  margin-bottom:45px;
}

.abt_hero_image img{
  width:80%;
  border-radius:30px;
  object-fit:cover;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

/* ================= FEATURES ================= */

.abt_features_grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px;
}

.abt_feature_card{
  background:white;
  border-radius:24px;
  padding:25px;
  box-shadow:0 5px 20px rgba(0,0,0,0.05);
}

.abt_icon_box{
  width:70px;
  height:70px;
  border-radius:20px;
  background:#ffe8f0;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
}

.abt_icon_box i{
  font-size:30px;
  color:#ef6b95;
}

.abt_feature_card h3{
  font-size:22px;
  margin-bottom:14px;
}

.abt_feature_card p{
  font-size:15px;
  line-height:1.8;
  margin:0;
}

/* ================= STORY ================= */

.abt_story_section{
  width:100%;
  padding:30px 6% 80px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.abt_story_image img{
  width:80%;
  border-radius:30px;
  object-fit:cover;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.abt_story_text h2{
  font-size:58px;
  line-height:1.2;
  margin:18px 0 25px;
}

.abt_story_text h2 span{
  color:#ef6b95;
}

.abt_story_text p{
  font-size:18px;
  line-height:1.9;
  color:#444;
  margin-bottom:35px;
}

.abt_btn{
  border:none;
  padding:18px 35px;
  border-radius:50px;
  background:white;
  border:2px solid #ef6b95;
  color:#ef6b95;
  font-size:17px;
  font-weight:600;
  cursor:pointer;
  transition:0.3s;
}

.abt_btn:hover{
  background:#ef6b95;
  color:white;
}

/* ================= TABLET ================= */

@media (max-width:768px){

  .abt_hero_section,
  .abt_story_section{
    grid-template-columns:1fr;
  }

  .abt_hero_text h1{
    font-size:50px;
  }

  .abt_story_text h2{
    font-size:42px;
  }

  .abt_features_grid{
    grid-template-columns:1fr;
  }

}

/* ================= MOBILE ================= */

@media (max-width:480px){

  .abt_header{
    padding:18px 5%;
  }

  .abt_burger{
    display:flex;
  }

  .abt_navbar{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:white;
    flex-direction:column;
    align-items:center;
    gap:22px;
    padding:30px 0;

    opacity:0;
    pointer-events:none;
    transform:translateY(-10px);
    transition:0.3s;
  }

  .abt_navbar.abt_show{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .abt_navbar a{
    color:#222;
  }

  .abt_nav_icons{
    display:none;
  }

  .abt_hero_section{
    padding-top:40px;
  }

  .abt_hero_text h1{
    font-size:38px;
  }

  .abt_story_text h2{
    font-size:34px;
  }

  .abt_hero_text p,
  .abt_story_text p{
    font-size:16px;
  }

  .abt_feature_card h3{
    font-size:19px;
  }

  .abt_btn{
    width:100%;
  }

}






/*--------------------------------------Contact css--------------------------------------------*/




*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:'Poppins', sans-serif;
  background:#fde2ed;
  color:#222;
  overflow-x:hidden;
}

/* ================= NAVBAR ================= */

.con_header{
  width:100%;
  padding:18px 6%;
  background-color: #e182a4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:999;
}

.con_logo img{
  width:90px;
}

.con_navbar{
  display:flex;
  gap:45px;
}

.con_navbar a{
  text-decoration:none;
  color:#222;
  font-size:18px;
  font-weight:500;
  position:relative;
}

.con_navbar a.con_active{
  color:white;
  font-weight:700;
}

.con_navbar a.con_active::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-8px;
  width:100%;
  height:3px;
  background:white;
}

.con_nav_icons{
  display:flex;
  align-items:center;
  gap:20px;
}

.con_nav_icons button{
  border:none;
  background:none;
  color:white;
  font-size:24px;
  cursor:pointer;
  position:relative;
}

.con_cart_btn span{
  position:absolute;
  top:-8px;
  right:-10px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#ff4375;
  color:white;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:600;
}

/* ================= BURGER ================= */

.con_burger{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}

.con_burger span{
  width:28px;
  height:3px;
  background:white;
  border-radius:50px;
  transition:0.3s;
}

.con_burger.con_open span:nth-child(1){
  transform:rotate(45deg) translateY(11px);
}

.con_burger.con_open span:nth-child(2){
  opacity:0;
}

.con_burger.con_open span:nth-child(3){
  transform:rotate(-45deg) translateY(-11px);
}

/* ================= CONTACT ================= */

.con_contact_section{
  width:100%;
  padding:70px 6%;
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:60px;
}

.con_small_title{
  color:#ef6b95;
  font-weight:700;
  letter-spacing:1px;
}

.con_left_side h1{
  font-size:65px;
  line-height:1.2;
  margin:18px 0 22px;
}

.con_left_side p{
  font-size:18px;
  color:#444;
  line-height:1.8;
  margin-bottom:40px;
}

/* ================= INFO ================= */

.con_info_wrapper{
  display:flex;
  flex-direction:column;
  gap:25px;
}

.con_info_item{
  display:flex;
  align-items:flex-start;
  gap:18px;
}

.con_icon_box{
  min-width:65px;
  height:65px;
  border-radius:18px;
  background:#ffe8f0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.con_icon_box i{
  font-size:28px;
  color:#ef6b95;
}

.con_info_item h3{
  font-size:24px;
  margin-bottom:5px;
}

.con_info_item span{
  color:#444;
  line-height:1.8;
}

/* ================= RIGHT ================= */

.con_right_side{
  display:grid;
  grid-template-columns:1fr 0.8fr;
  gap:25px;
  align-items:stretch;
}

.con_form_box{
  background:white;
  padding:35px;
  border-radius:28px;
  box-shadow:0 5px 20px rgba(0,0,0,0.05);
}

.con_form_box h2{
  font-size:42px;
  margin-bottom:25px;
}

.con_form_box form{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.con_form_box input,
.con_form_box textarea{
  width:100%;
  border:1px solid #f0c9d6;
  border-radius:16px;
  padding:18px;
  font-size:16px;
  font-family:'Poppins', sans-serif;
  outline:none;
}

.con_form_box textarea{
  min-height:190px;
  resize:none;
}

.con_submit_btn{
  border:none;
  background:linear-gradient(to right,#ef6b95,#ff6f91);
  color:white;
  padding:18px;
  border-radius:50px;
  font-size:18px;
  font-weight:600;
  cursor:pointer;
  transition:0.3s;
}

.con_submit_btn:hover{
  transform:translateY(-3px);
}

.con_flower_image img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:28px;
}

/* ================= MAP ================= */

.con_map_section{
  width:100%;
  padding:0 6% 80px;
}

.con_map_box{
  width:100%;
  height:420px;
  border-radius:30px;
  overflow:hidden;
  position:relative;
  box-shadow:0 5px 20px rgba(0,0,0,0.05);
}

.con_map_box iframe{
  width:100%;
  height:100%;
  border:none;
}

.con_map_card{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  background:white;
  padding:22px 25px;
  border-radius:24px;
  display:flex;
  align-items:flex-start;
  gap:18px;
  box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.con_map_card i{
  color:#ef6b95;
  font-size:30px;
}

.con_map_card h3{
  margin-bottom:6px;
}

/* ================= TABLET ================= */

@media (max-width:768px){

  .con_contact_section{
    grid-template-columns:1fr;
  }

  .con_right_side{
    grid-template-columns:1fr;
  }

  .con_left_side h1{
    font-size:50px;
  }

  .con_form_box h2{
    font-size:34px;
  }

}

/* ================= MOBILE ================= */

@media (max-width:480px){

  .con_header{
    padding:18px 5%;
  }

  .con_burger{
    display:flex;
  }

  .con_navbar{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:white;
    flex-direction:column;
    align-items:center;
    gap:22px;
    padding:30px 0;

    opacity:0;
    pointer-events:none;
    transform:translateY(-10px);
    transition:0.3s;
  }

  .con_navbar.con_show{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .con_navbar a{
    color:#222;
  }

  .con_nav_icons{
    display:none;
  }

  .con_contact_section{
    padding-top:40px;
  }

  .con_left_side h1{
    font-size:38px;
  }

  .con_left_side p{
    font-size:16px;
  }

  .con_form_box{
    padding:25px;
  }

  .con_form_box h2{
    font-size:28px;
  }

  .con_map_card{
    width:90%;
    left:50%;
    top:auto;
    bottom:20px;
    transform:translateX(-50%);
  }

}












/*-------------------------------------Login--------------------------------------*/




body{
margin:0;
font-family:Poppins;
background:linear-gradient(135deg,#ffd1dc,#fff);
}

/* FLOWERS */
.log_bg span{
position:absolute;
width:15px;
height:15px;
background:pink;
border-radius:50%;
animation:float 12s linear infinite;
opacity:0.4;
}

@keyframes float{
0%{transform:translateY(100vh);}
100%{transform:translateY(-10vh);}
}

/* LOGIN CARD */
.log_container{
display:flex;
justify-content:center;
align-items:center;
height:100vh;
}

.log_card{
background:white;
padding:30px;
width:320px;
border-radius:20px;
text-align:center;
box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

input{
width:100%;
padding:10px;
margin:8px 0;
border-radius:10px;
border:1px solid #ddd;
}

.log_pass_box{
display:flex;
align-items:center;
background:#ffe6f0;
padding:8px;
border-radius:10px;
}

.log_pass_box input{
border:none;
background:transparent;
outline:none;
}

button{
width:100%;
padding:10px;
margin-top:10px;
border:none;
border-radius:10px;
cursor:pointer;
}

#log_login{background:#ff4d88;color:white;}
#log_openRegister{background:white;border:1px solid #ff4d88;color:#ff4d88;}

a{font-size:12px;color:#ff4d88;}

/* MODAL */
.log_modal{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.4);
justify-content:center;
align-items:center;
}

.log_modal_card{
background:white;
padding:20px;
border-radius:15px;
width:300px;
position:relative;
}

#log_close{
position:absolute;
right:10px;
top:10px;
cursor:pointer;
}