@charset "utf-8";
/* CSS Document */

* :focus { outline: 0 !important; }

/* form validation  */
    label.valid { width: 24px; height: 24px; background: url(/img/valid.png) center center no-repeat; display: inline-block; text-indent: -9999px; }
    label.error { font-weight: bold; color: red; padding: 2px 8px; margin-top: 2px; }
    .controls{   position:relative;  }
    .has-success .controls i{ font-weight: bold;font-size: 18px;display: block;position: absolute;right: 10px;top: 2px;}
    .has-success i:after {/*font-family: "Glyphicons Halflings";content:"\e013";*/font-family: 'FontAwesome'; content: "\f00c";color: green; font-size:20px;font-weight: bold;}
    .has-error .controls i{ font-weight: bold;font-size: 18px;display: block;position: absolute;right: 10px;top: 2px;}
    .has-error i:after {/*font-family: "Glyphicons Halflings";content:"\e014";*/font-family: 'FontAwesome'; content: "\f00d";color: red;}
    a {text-decoration: none;}
/* endformvalidation */

/*.clear {clear:both;}
.logblock { padding-top: 15px;}
.lang { padding-top: 20px;}
.navbar-default {background-color:#FFFFFF; border:0px;}
.bold {font-weight:bold;}
#footer{text-align:center; padding-top:10px; margin-top:30px;}
.container-fluid{padding-left:0px; padding-right:0px;}
.btn-default {color: #6c757d; background-color: transparent; background-image: none; border-color: #ddd;}
.btn-space{margin-left:5px;}
.space{margin-left:15px;}
.notfound{margin-top:60px; text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:100px; color:#0099FF;}
.notfound1{margin-top:40px; text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:40px; color:#000000; margin-bottom:100px;}

#bannerhp img {height: 60vh;}
.breadcrumb {background-color:#fff; padding-left:0;}
*/

:root{
  --serif:'Playfair Display', serif;
  --sans:'Inter', sans-serif;
  --accent:#6e1b1b;
  --light-bg:#f4f1ef;
}

body{
  font-family:var(--sans);
  background:var(--light-bg);
  color:#222;
}

/* NAVBAR */
.navbar { height: 80px; background: #fff;}
.navbar-brand { font-family: var(--serif); font-size: 1.4rem; letter-spacing: 2px;}
.nav-link{ position:relative; letter-spacing:2px; font-size:.85rem; text-transform:uppercase; color:#333; padding-bottom:5px; transition:color .3s ease;}

/* Underline effect */
.nav-link::after{ content:""; position:absolute; left:50%; bottom:0; width:0; height:1px; background:var(--accent); transition:all .4s ease; transform:translateX(-50%);}
.nav-link:hover{ color:var(--accent);}
.nav-link:hover::after{ width:100%;}

/* HERO */
.hero{ width:100%; height:75vh; background:url("../img/hero2.jpg") center/cover no-repeat;}

/* CONTENT SECTION */
.content-section{ padding:60px 0; text-align: center;}
.main-title{ font-family:var(--serif); font-size:3rem; margin-bottom:30px; opacity:0; transform:translateY(40px); transition:1s ease; color:var(--accent);
}
.subtitle{ font-size:1.2rem; line-height:1.9; color:#555; margin-bottom:40px; opacity:0; transform:translateY(40px); transition:1.2s ease;}

/* BUTTONS */
.btn-outline-custom{ border:1px solid #999; padding:14px 35px; letter-spacing:2px; font-size:.85rem; text-transform:uppercase; background:transparent;
  transition:.3s; color:#222;}
.btn-outline-custom:hover{ background:#ddd;}
.btn-accent{ background:var(--accent); color:#fff; padding:14px 50px; letter-spacing:2px; font-size:.85rem; text-transform:uppercase;
  border:none; transition:.3s;}
.btn-accent:hover{ background:#4d0f0f;}

/* ANIMATION ACTIVE */
.reveal{ opacity:1 !important; transform:translateY(0) !important;}
.fade-up{ opacity:0; transform:translateY(40px); transition:1s ease;}
.fade-up.show{ opacity:1; transform:translateY(0);}

/* HEADER TITLE */
.page-header{ padding:60px 0 30px; text-align:center;}
.page-header h1{ font-family:var(--serif); font-size:2.5rem; letter-spacing:4px; margin-bottom:30px;}
.page-header p{ max-width:900px; margin:0 auto; line-height:1.8; font-size:1.05rem; color:#555;}

/* CARD */
.collection-card{
  background: #e1ddda;/*#ece8e4;  warm light background */
  margin-bottom:50px;
  border:1px solid #e3ded9;
}

.collection-img{ overflow:hidden;}
.collection-img img{ width:100%; display:block; transition:transform 1.8s cubic-bezier(.19,1,.22,1);}
.collection-card:hover .collection-img img{ transform:scale(1.06);}

/* CONTENT */
.collection-content{ padding:20px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:15px;}
.collection-info h3{ font-family:var(--serif); font-size:1.25rem; letter-spacing:1px; font-weight:400; margin-bottom:6px;}
.collection-info p{ font-size:.95rem; color:#666; margin:0; font-weight:300;}

/* BUTTON */
.view-btn{ background:transparent; border:1px solid #cfc7c1; padding:8px 20px; font-size:.75rem; letter-spacing:1px; text-transform:uppercase;
  color:#333; transition:all .3s ease;}
.view-btn:hover{ background:#dcd5cf; border-color:#dcd5cf;}

/* RESPONSIVE */
@media(max-width:768px){

  .hero{ height:50vh; }
  .main-title{ font-size:2.2rem; }
  .content-section{ padding:60px 0; }
  .btn-accent{ margin-top:15px; }
}

/* FOOTER – DARK */
.footer { background: #222; color: #ccc; padding: 60px 0 30px; font-size: .8rem; letter-spacing: 1.5px;}
.footer-title { font-family: var(--serif); font-size: 1rem; letter-spacing: 3px; margin-bottom: 30px; color: #fff;}
.footer a { color: #aaa; text-decoration: none;}
.footer a:hover { color: #fff;}
.footer-social a { display: inline-block; margin-right: 20px; font-size: .75rem; letter-spacing: 2px;}
.footer-bottom { margin-top: 10px; font-size: .7rem; color: #666; text-align: center;}


/* MOBILE – ONE COLUMN 
@media (max-width: 768px) {
  .footer { text-align: center; }
  .footer-social a { margin: 0 10px; }
}*/

/* MOBILE TOGGLER */
.navbar-toggler:focus{ box-shadow:none;}

/* OFFCANVAS STYLE */
.offcanvas{ width:75%; background:#fff; padding:40px; transition:transform .4s cubic-bezier(.77,0,.18,1);}
.offcanvas .nav-link{ font-size:1rem; letter-spacing:2px; text-transform:uppercase; color:#222; transition:.3s;}
.offcanvas .nav-link:hover{ color:var(--accent); transform:translateX(-5px);}

/* Smooth backdrop */
.offcanvas-backdrop.show{ opacity:.3;}
