/* =====================================================================
   Swastika Designers — supplemental styles (loaded after the theme CSS)
   ===================================================================== */

/* ---- Image rendering in card grids ------------------------------- */
.projects .item .position-re img,
.bauen-blog .item .position-re img,
.proj-grid .position-re img { width: 100%; height: 280px; object-fit: cover; transition: transform .6s ease; }
.projects .item:hover .position-re img,
.bauen-blog .item:hover .position-re img { transform: scale(1.06); }
.grid-row .item { margin-bottom: 30px; }

/* keep service/blog/project cards aligned as a static grid */
.card-grid { display: flex; flex-wrap: wrap; }

/* ---- Hero crossfade slider --------------------------------------- */
.header.slider-fade { position: relative; }
.hero-slides { position: relative; min-height: 100vh; }
.hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease; }
.hero-slide.is-active { opacity: 1; }
.hero-slide img { width: 100%; height: 100vh; object-fit: cover; display: block; }
/* dark overlay (theme normally injects this via JS, which we don't load) */
.hero-slide::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.55)); z-index: 1; }
.hero-slide .caption { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; }
.hero-slide .caption h1 { color: #fff; font-size: 54px; line-height: 1.1; margin-bottom: 14px; }
.hero-slide .caption .hero-sub { color: #f0f0f0; font-size: 19px; max-width: 620px; }
@media (max-width: 767px){ .hero-slide .caption h1 { font-size: 32px; } .col-md-9.offset-md-3 { text-align:center; } }

/* ---- Breadcrumb bar ---------------------------------------------- */
.crumbs { font-size: 13px; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 18px; color: #999; }
.crumbs a { color: #c9a227; }
.crumbs span { color: #777; }

/* ---- Service icon tiles ------------------------------------------ */
.services .item .svc-icon { font-size: 42px; color: #c9a227; line-height: 1; margin-bottom: 14px; display: inline-block; }

/* ---- Blog post typography ---------------------------------------- */
.post-body { font-size: 17px; line-height: 1.85; }
.post-body h2, .post-body h3 { margin: 30px 0 14px; }
.post-body h2 { font-size: 26px; }
.post-body h3 { font-size: 21px; }
.post-body ul, .post-body ol { margin: 0 0 20px 22px; }
.post-body li { margin-bottom: 8px; }
.post-body p { margin-bottom: 18px; }
.post-body img { max-width: 100%; height: auto; margin: 18px 0; border-radius: 4px; }
.post-body a { color: #c9a227; text-decoration: underline; }
.post-meta { color: #888; font-size: 14px; margin-bottom: 24px; }
.post-meta span { margin-right: 18px; }
.tag-list a { display: inline-block; background: #f2f2f2; color: #555; padding: 5px 12px; margin: 0 8px 8px 0; border-radius: 30px; font-size: 13px; }

/* blog list card */
.blog-card { background:#fff; box-shadow:0 6px 30px rgba(0,0,0,.06); margin-bottom:30px; }
.blog-card .position-re img { height: 240px; width:100%; object-fit:cover; }
.blog-card .con { padding: 22px 24px 26px; }
.blog-card .category a { color:#c9a227; font-size:13px; text-transform:uppercase; letter-spacing:.05em; }
.blog-card h5 { margin:10px 0 12px; font-size:20px; line-height:1.35; }
.blog-card p { color:#666; font-size:15px; }
.read-more { color:#111; font-weight:600; letter-spacing:.03em; }

/* ---- Testimonials rating ----------------------------------------- */
.t-stars { color:#f0a500; letter-spacing:2px; margin-bottom:8px; }

/* ---- Contact ----------------------------------------------------- */
.contact-form .form-note { font-size: 13px; color:#888; margin-top: 8px; }
.alert { padding: 14px 18px; border-radius: 4px; margin-bottom: 22px; font-size: 15px; }
.alert-success { background:#e8f6ec; color:#1c7a3e; border:1px solid #b6e2c4; }
.alert-error   { background:#fdecec; color:#a32525; border:1px solid #f3bcbc; }
.field-error { color:#c0392b; font-size:13px; margin-top:4px; }
.map-wrap { margin-top: 40px; }
.map-wrap iframe { width:100%; height: 360px; border:0; filter: grayscale(.2); }

/* ---- WhatsApp floating button ------------------------------------ */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:9999;width:58px;height:58px;border-radius:50%;
  background:#25d366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 22px rgba(37,211,102,.5);animation:wapulse 2.4s infinite;}
.wa-float:hover{background:#1ebe5b;}
@keyframes wapulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}70%{box-shadow:0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}

/* inner-page banner title overlay */
.banner-header.has-title { position: relative; }
.page-hero { padding: 130px 0 60px; }
.page-hero .section-title2 { margin-bottom: 6px; }
.page-hero .lead { color:#ddd; max-width: 720px; }

/* small helpers */
.mt-15{margin-top:15px}.mb-30{margin-bottom:30px}.text-muted{color:#888}
.cta-band{background:#111;color:#fff;padding:60px 0;text-align:center}
.cta-band h3{color:#fff;margin-bottom:18px}
@media (max-width: 991px){ .hero-slide img{height:70vh} .hero-slides{min-height:70vh} }
