/* ===== SERVICES PAGE CSS – DAS INTERIOR ===== */

/* ===== PAGE HERO ===== */
.page-hero{padding:180px 0 100px;text-align:center;position:relative;overflow:hidden}
.page-hero-bg{position:absolute;inset:0}
.page-hero-bg img{width:100%;height:100%;object-fit:cover}
.page-hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.6) 100%)}
.page-hero h1{font-family:'Playfair Display',serif;font-size:clamp(36px,6vw,68px);font-weight:900;color:#fff;margin-bottom:16px;position:relative;line-height:1.15}
.page-hero p{color:rgba(255,255,255,0.75);font-size:clamp(14px,2vw,17px);position:relative;max-width:600px;margin:0 auto;line-height:1.7}
.breadcrumb{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:20px;font-size:13px;color:rgba(255,255,255,0.5);position:relative}
.breadcrumb a{color:var(--gold);transition:color .2s}.breadcrumb a:hover{color:var(--gold-light)}
.breadcrumb span{color:rgba(255,255,255,0.4)}

/* ===== SERVICES MAIN SECTION ===== */
.services-main{background:var(--dark);padding:100px 0}

/* 3-column card grid */
.srv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}

/* ===== SERVICE CARD ===== */
.srv-card{
  background:var(--dark3);border:1px solid var(--border);border-radius:16px;
  overflow:hidden;transition:all .4s cubic-bezier(.25,.46,.45,.94);
  animation:fadeUp .6s ease calc(var(--i) * .07s) both;
  display:flex;flex-direction:column;
}
.srv-card:hover{transform:translateY(-10px);box-shadow:0 40px 80px rgba(0,0,0,0.5);border-color:rgba(201,168,76,0.5)}

/* Card image area */
.srv-img{height:220px;position:relative;overflow:hidden;flex-shrink:0}
.srv-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;display:block}
.srv-card:hover .srv-img img{transform:scale(1.1)}
.srv-img-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,0.65) 0%,transparent 60%);
  transition:background .3s ease;
}
.srv-card:hover .srv-img-overlay{background:linear-gradient(to top,rgba(201,168,76,0.55) 0%,transparent 60%)}

/* Card number badge */
.srv-num{
  position:absolute;top:16px;right:16px;
  width:38px;height:38px;
  background:rgba(0,0,0,0.65);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.15);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:var(--gold);z-index:2;letter-spacing:.5px;
}

/* Card body */
.srv-body{padding:26px;flex:1;display:flex;flex-direction:column}
.srv-icon{
  width:46px;height:46px;
  background:rgba(201,168,76,0.1);border:1px solid var(--border);
  border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:20px;color:var(--gold);margin-bottom:16px;transition:all .3s ease;
}
.srv-card:hover .srv-icon{background:rgba(201,168,76,0.2);border-color:rgba(201,168,76,0.5);transform:scale(1.1)}
.srv-body h3{font-family:'Playfair Display',serif;font-size:20px;color:#fff;margin-bottom:10px;line-height:1.3}
.srv-body p{color:var(--text-muted);font-size:13px;line-height:1.75;flex:1;margin-bottom:18px}

/* Price badge */
.srv-price{
  display:inline-flex;align-items:baseline;gap:4px;
  background:rgba(201,168,76,0.12);border:1px solid rgba(201,168,76,0.3);
  border-radius:8px;padding:8px 16px;
  font-size:16px;font-weight:800;
  color:var(--gold);letter-spacing:.5px;
  margin-top:auto;
}
.srv-price span{font-size:12px;font-weight:500;color:var(--text-muted)}

/* ===== PRICING TABLE SECTION ===== */
.pricing-table-section{background:var(--dark2);padding:100px 0}
.pricing-table-wrap{overflow-x:auto;border-radius:16px;border:1px solid var(--border)}
.pricing-table{width:100%;border-collapse:collapse;background:var(--dark3)}
.pricing-table thead tr{background:var(--gold-grad)}
.pricing-table thead th{padding:18px 24px;font-family:'Raleway',sans-serif;font-size:13px;font-weight:800;color:#111;text-transform:uppercase;letter-spacing:2px;text-align:left}
.pricing-table thead th:first-child{width:60px;text-align:center}
.pricing-table thead th:last-child{text-align:right}
.pricing-table tbody tr{border-bottom:1px solid var(--border);transition:background .2s ease}
.pricing-table tbody tr:last-child{border-bottom:none}
.pricing-table tbody tr:hover{background:rgba(201,168,76,0.06)}
.pricing-table tbody td{padding:16px 24px;font-size:14px;color:var(--text);line-height:1.5}
.pricing-table tbody td:first-child{text-align:center;color:var(--gold);font-weight:700;font-size:13px;width:60px}
.pricing-table tbody td:last-child{text-align:right;font-weight:700;color:var(--gold);font-size:15px;white-space:nowrap}
.pricing-table tbody td:nth-child(2){color:var(--text)}

/* alternating row bg */
.pricing-table tbody tr:nth-child(even){background:rgba(255,255,255,0.02)}
.pricing-table tbody tr:nth-child(even):hover{background:rgba(201,168,76,0.06)}

/* ===== SERVICES CTA SECTION ===== */
.srv-cta{position:relative;padding:120px 0;text-align:center;overflow:hidden}
.srv-cta-bg{position:absolute;inset:0}
.srv-cta-bg img{width:100%;height:100%;object-fit:cover}
.srv-cta-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.8)}
.srv-cta h2{position:relative;z-index:2;font-family:'Playfair Display',serif;font-size:clamp(30px,5vw,52px);font-weight:700;color:#fff;margin-bottom:16px;line-height:1.2}
.srv-cta p{position:relative;z-index:2;color:rgba(255,255,255,0.75);font-size:16px;margin-bottom:36px}
.srv-cta-btns{position:relative;z-index:2;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* ===== REVEAL ANIMATION ===== */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .65s ease,transform .65s ease}
.reveal.revealed{opacity:1;transform:translateY(0)}
@keyframes fadeUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  .srv-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .srv-grid{grid-template-columns:1fr}
  .page-hero{padding:140px 0 70px}
  .pricing-table thead th,.pricing-table tbody td{padding:14px 16px}
  .pricing-table tbody td:last-child{white-space:normal}
  .srv-cta-btns{flex-direction:column;align-items:center}
}
