/* =========================================
   pages.css — All inner page styles
   Service, Blog, About, Contact, Generic
   ========================================= */

/* ── PAGE HERO (shared) ── */
.page-hero{padding:7rem 0 5rem;position:relative;overflow:hidden;min-height:420px;display:flex;align-items:center}
.page-hero--service{background:linear-gradient(135deg,var(--black) 0%,var(--black-soft) 60%,#2a0008 100%)}
.page-hero--blog{background:linear-gradient(135deg,var(--black-soft) 0%,#1a1a2e 100%)}
.page-hero--blog-detail{background:linear-gradient(135deg,var(--black) 0%,#1a0005 100%);padding:6rem 0 4rem}
.page-hero--about{background:linear-gradient(135deg,var(--black) 0%,var(--red-dark) 60%,var(--black-soft) 100%)}
.page-hero--contact{background:linear-gradient(135deg,var(--red-dark) 0%,var(--black) 100%)}
.page-hero--generic{background:var(--gray-100);padding:5rem 0 3rem}
.page-hero--generic .page-hero-title{color:var(--black)}
.page-hero--generic .page-hero-sub{color:var(--gray-600)}

.hero-inner-page{position:relative;z-index:2}
.page-hero-title{font-family:var(--font-display);font-size:clamp(2rem,4.5vw,3.75rem);font-weight:700;color:#fff;line-height:1.15;letter-spacing:-.03em;margin-bottom:1.25rem}
.page-hero-sub{font-size:1.125rem;color:rgba(255,255,255,.75);max-width:60ch;line-height:1.7;margin-bottom:2rem}
.page-hero-ctas{display:flex;flex-wrap:wrap;gap:1rem}

/* animated background particles */
.hero-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-particles::before{content:'';position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(224,30,44,.15) 0%,transparent 70%);top:-200px;right:-100px;animation:blob-pulse 8s ease-in-out infinite}
.hero-particles::after{content:'';position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(224,30,44,.08) 0%,transparent 70%);bottom:-100px;left:-50px;animation:blob-pulse 10s ease-in-out 2s infinite}
.hero-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px;pointer-events:none}
@keyframes blob-pulse{0%,100%{transform:scale(1) translate(0,0)}50%{transform:scale(1.12) translate(20px,-20px)}}

/* breadcrumb */
.breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:rgba(255,255,255,.5);margin-bottom:1.5rem;flex-wrap:wrap}
.breadcrumb a{color:rgba(255,255,255,.5);transition:color .2s}
.breadcrumb a:hover{color:#fff}
.breadcrumb span[aria-current]{color:rgba(255,255,255,.8)}

/* ── SERVICES CATEGORY PAGE ── */
.sub-services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;margin-top:2rem}
.sub-card{display:block;background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:2rem;transition:all .3s var(--ease);position:relative;overflow:hidden}
.sub-card::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(224,30,44,.04),transparent);opacity:0;transition:opacity .3s}
.sub-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-6px);border-color:rgba(224,30,44,.2)}
.sub-card:hover::after{opacity:1}
.sub-card-num{font-family:var(--font-display);font-size:3rem;font-weight:700;color:rgba(224,30,44,.1);line-height:1;margin-bottom:.5rem}
.sub-card-title{font-size:1.125rem;font-weight:700;color:var(--black);margin-bottom:.625rem}
.sub-card-desc{font-size:.9375rem;color:var(--gray-600);line-height:1.6;margin-bottom:1.25rem}
.sub-card-arrow{font-size:1.25rem;color:var(--red);display:inline-block;transition:transform .25s var(--ease)}
.sub-card:hover .sub-card-arrow{transform:translateX(6px)}

/* ── SERVICE DETAIL ── */
.content-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:4rem;align-items:start}
.content-main .section-label{margin-bottom:.625rem}
.prose{font-size:1rem;color:var(--gray-600);line-height:1.85}
.prose p{margin-bottom:1rem}
.prose h3{color:var(--black);font-weight:700;margin:1.5rem 0 .5rem}
.prose ul{list-style:disc;padding-left:1.5rem;margin-bottom:1rem}
.prose li{margin-bottom:.4rem}
.aside-card{background:var(--gray-100);border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:2rem;position:sticky;top:100px}
.aside-card h3{font-size:1.125rem;font-weight:700;margin-bottom:1.25rem}
.check-list{display:flex;flex-direction:column;gap:.625rem}
.check-list li{display:flex;align-items:flex-start;gap:.5rem;font-size:.9375rem;color:var(--gray-600)}
.check-list li::before{content:'✓';color:var(--red);font-weight:700;flex-shrink:0;margin-top:1px}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem}
.feat-card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:1.75rem;transition:all .3s var(--ease)}
.feat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);border-color:rgba(224,30,44,.15)}
.feat-icon{width:40px;height:40px;background:var(--red);color:#fff;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-weight:700;margin-bottom:1rem}
.feat-card h3{font-size:1rem;font-weight:700;margin-bottom:.5rem}
.feat-card p{font-size:.9rem;color:var(--gray-600);line-height:1.6}

/* process timeline */
.process-timeline{display:flex;flex-direction:column;gap:0;margin-top:2.5rem;max-width:700px}
.timeline-step{display:flex;gap:2rem;align-items:flex-start;padding-bottom:2.5rem;position:relative}
.timeline-step:not(:last-child)::before{content:'';position:absolute;left:23px;top:48px;bottom:0;width:2px;background:linear-gradient(180deg,var(--red),rgba(224,30,44,.1))}
.timeline-num{width:48px;height:48px;background:var(--red);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:1.1rem;flex-shrink:0;box-shadow:var(--shadow-red);position:relative;z-index:1}
.timeline-body h3{font-size:1.0625rem;font-weight:700;margin-bottom:.375rem;color:var(--black)}
.timeline-body p{font-size:.9375rem;color:var(--gray-600);line-height:1.65}

/* FAQ (shared with homepage) */
.faq-wrap{max-width:800px}
.faq-list{display:flex;flex-direction:column;gap:.75rem}
.faq-item{border:1px solid var(--gray-200);border-radius:var(--radius-lg);overflow:hidden;transition:border-color .2s}
.faq-item.active{border-color:var(--red)}
.faq-question{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;font-size:1rem;font-weight:500;color:var(--black);background:#fff;gap:1rem;transition:background .2s;cursor:pointer}
.faq-question:hover{background:var(--gray-100)}
.faq-item.active .faq-question{background:rgba(224,30,44,.04);color:var(--red)}
.faq-chevron{flex-shrink:0;transition:transform .3s var(--ease)}
.faq-item.active .faq-chevron{transform:rotate(180deg)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.faq-answer.open{max-height:500px}
.faq-answer[hidden]{display:block!important}
.faq-answer-content{padding:0 1.5rem 1.25rem;font-size:.9375rem;color:var(--gray-600);line-height:1.7}

/* CTA band */
.cta-band{background:var(--gray-100)}
.cta-band.section--dark{background:var(--black-soft)}
.cta-band.section--red{background:var(--red)}
.cta-band-inner{display:flex;align-items:center;justify-content:space-between;gap:3rem;flex-wrap:wrap}
.cta-band-inner .section-title{margin-bottom:.5rem}
.cta-band-inner .section-subtitle{margin-bottom:0;max-width:52ch}
.cta-btns{display:flex;gap:1rem;flex-wrap:wrap}

/* ── BLOG ── */
.blog-cats{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.cat-pill{display:inline-flex;align-items:center;padding:.4rem 1.125rem;border:1px solid rgba(255,255,255,.2);border-radius:100px;font-size:.875rem;font-weight:500;color:rgba(255,255,255,.7);transition:all .2s}
.cat-pill:hover,.cat-pill--active{background:var(--red);border-color:var(--red);color:#fff}
.featured-posts{
  display:grid;
  grid-template-columns:1.5fr 1fr;
  grid-template-rows:auto auto;
  gap:1.5rem;
  margin-top:1rem;
}
/* Large card spans both rows on the left */
.featured-post--large{
  grid-column:1;
  grid-row:1 / 3;
}
/* Smaller cards stack on the right */
.featured-posts .featured-post:not(.featured-post--large){
  grid-column:2;
}
.featured-post{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-xl);overflow:hidden;transition:all .3s var(--ease);display:flex;flex-direction:column}
.featured-post:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.featured-post--large .featured-post-img-wrap{
  aspect-ratio:4/3;
  flex-shrink:0;
}
.featured-post--large{
  height:100%;
}
.featured-post-img-wrap{
  overflow:hidden;
  aspect-ratio:16/9;
  display:block;
  flex-shrink:0;
}
.featured-post-img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.featured-post:hover .featured-post-img{transform:scale(1.04)}
.post-img-placeholder{background:linear-gradient(135deg,var(--gray-200),var(--gray-100));aspect-ratio:16/9;width:100%}
.featured-post-body{
  padding:1.5rem;
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.post-cat-badge{display:inline-block;background:rgba(224,30,44,.1);color:var(--red);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.2rem .75rem;border-radius:100px;margin-bottom:.75rem}
.post-cat-badge--hero{background:rgba(255,255,255,.15);color:#fff;margin-bottom:1rem}
.featured-post-title{font-size:1.0625rem;font-weight:700;color:var(--black);margin-bottom:.625rem;line-height:1.4;flex:1}
.featured-post-title a:hover{color:var(--red)}
.post-excerpt{font-size:.875rem;color:var(--gray-600);line-height:1.6;margin-bottom:1rem}
.post-meta{display:flex;flex-wrap:wrap;gap:.75rem;font-size:.8125rem;color:var(--gray-400)}
.post-meta--hero{color:rgba(255,255,255,.55);margin-top:.75rem}
.posts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}
.post-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-xl);overflow:hidden;transition:all .3s var(--ease)}
.post-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}
.post-card-img-wrap{overflow:hidden;aspect-ratio:16/10;display:block}
.post-card-img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.post-card:hover .post-card-img{transform:scale(1.05)}
.post-card-body{padding:1.5rem}
.post-card-title{font-size:1rem;font-weight:700;color:var(--black);margin:.625rem 0;line-height:1.4}
.post-card-title a:hover{color:var(--red)}
.post-card-excerpt{font-size:.875rem;color:var(--gray-600);line-height:1.6;margin-bottom:.875rem}
.no-posts{color:var(--gray-400);font-size:1rem;text-align:center;padding:3rem 0}
/* Article layout */
.article-cover{background:var(--gray-100);padding:2rem 0}
.article-cover-img{border-radius:var(--radius-xl);max-height:520px;width:100%;object-fit:cover}
.article-layout{display:grid;grid-template-columns:1fr 320px;gap:4rem;padding:4rem 0}
.article-body{font-size:1.0625rem;color:var(--gray-600);line-height:1.85}
.article-body h2{font-family:var(--font-display);font-size:1.75rem;font-weight:700;color:var(--black);margin:2rem 0 1rem;letter-spacing:-.02em}
.article-body h3{font-size:1.25rem;font-weight:700;color:var(--black);margin:1.5rem 0 .75rem}
.article-body p{margin-bottom:1.25rem}
.article-body ul,.article-body ol{padding-left:1.75rem;margin-bottom:1.25rem}
.article-body li{margin-bottom:.4rem}
.article-body strong{color:var(--black);font-weight:600}
.article-body a{color:var(--red);border-bottom:1px solid rgba(224,30,44,.25);transition:border-color .2s}
.article-body a:hover{border-color:var(--red)}
.article-tags{display:flex;flex-wrap:wrap;gap:.625rem;margin-top:2.5rem;padding-top:2rem;border-top:1px solid var(--gray-200)}
.tag-pill{display:inline-block;background:var(--gray-100);color:var(--gray-600);padding:.3rem .875rem;border-radius:100px;font-size:.8125rem;font-weight:500;transition:all .2s}
.tag-pill:hover{background:var(--red);color:#fff}
.article-sidebar{position:sticky;top:100px;display:flex;flex-direction:column;gap:1.5rem}
.sidebar-card{background:var(--gray-100);border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:1.75rem}
.sidebar-card h3{font-size:1rem;font-weight:700;margin-bottom:.75rem}
.sidebar-card p{font-size:.9rem;color:var(--gray-600);margin-bottom:1.25rem;line-height:1.6}
.related-post-item{display:flex;flex-direction:column;gap:.2rem;padding:.75rem 0;border-bottom:1px solid var(--gray-200);transition:color .2s}
.related-post-item:last-child{border-bottom:none}
.related-post-item:hover{color:var(--red)}
.related-post-item strong{font-size:.9rem;font-weight:600;color:var(--black);line-height:1.4}
.related-post-item span{font-size:.8rem;color:var(--gray-400)}
/* Pagination */
.pagination{display:flex;align-items:center;gap:.5rem;justify-content:center;margin-top:3rem}
.page-btn{min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);border-radius:var(--radius);font-size:.9rem;font-weight:500;color:var(--gray-600);transition:all .2s;padding:0 .75rem}
.page-btn:hover{border-color:var(--red);color:var(--red)}
.page-btn--active{background:var(--red);border-color:var(--red);color:#fff}

/* ── ABOUT PAGE ── */
.stats-band{background:var(--red);padding:3rem 0}
.stats-row{display:flex;justify-content:space-around;flex-wrap:wrap;gap:2rem}
.stat-item{text-align:center}
.stat-num{display:block;font-family:var(--font-display);font-size:3rem;font-weight:700;color:#fff;line-height:1}
.stat-label{display:block;font-size:.875rem;font-weight:500;color:rgba(255,255,255,.7);margin-top:.5rem;letter-spacing:.06em;text-transform:uppercase}
.about-values{display:flex;flex-direction:column;gap:1.25rem}
.value-card{background:var(--gray-100);border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:1.75rem;border-left:3px solid var(--red)}
.value-icon{font-size:2rem;margin-bottom:.75rem}
.value-card h3{font-size:1rem;font-weight:700;margin-bottom:.5rem}
.value-card p{font-size:.9375rem;color:var(--gray-600);line-height:1.6}
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem;margin-top:1rem}
.team-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:1.75rem;text-align:center;transition:all .3s var(--ease)}
.team-card:hover{box-shadow:var(--shadow-md);transform:translateY(-5px)}
.team-photo{width:100px;height:100px;border-radius:50%;object-fit:cover;margin:0 auto 1rem;border:3px solid rgba(224,30,44,.2)}
.team-photo-placeholder{width:100px;height:100px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:700;margin:0 auto 1rem}
.team-name{font-size:1rem;font-weight:700;color:var(--black);margin-bottom:.25rem}
.team-role{font-size:.875rem;color:var(--red);font-weight:500}
.team-bio{font-size:.875rem;color:var(--gray-600);line-height:1.5;margin-top:.75rem}
.team-linkedin{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--gray-100);border-radius:var(--radius);color:var(--gray-600);font-weight:700;font-size:.875rem;margin-top:.875rem;transition:all .2s}
.team-linkedin:hover{background:#0A66C2;color:#fff}
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.25rem;margin-top:2.5rem}
.why-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-xl);padding:2rem;transition:all .3s}
.why-card:hover{background:rgba(255,255,255,.1);transform:translateY(-4px)}
.why-icon{font-size:2rem;margin-bottom:1rem}
.why-card h3{font-size:1rem;font-weight:700;color:#fff;margin-bottom:.625rem}
.why-card p{font-size:.9375rem;color:rgba(255,255,255,.65);line-height:1.6}

/* ── CONTACT PAGE ── */
.contact-layout{display:grid;grid-template-columns:1.4fr 1fr;gap:5rem;align-items:start}
.contact-form{display:flex;flex-direction:column;gap:1.25rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.form-group{display:flex;flex-direction:column;gap:.4rem}
.form-group label{font-size:.875rem;font-weight:600;color:var(--black)}
.req{color:var(--red)}
input,textarea,select{padding:.8125rem 1rem;border:2px solid var(--gray-200);border-radius:var(--radius);font-size:.9375rem;color:var(--black);background:#fff;transition:border-color .2s;outline:none;font-family:inherit;width:100%}
input:focus,textarea:focus,select:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(224,30,44,.1)}
textarea{resize:vertical}
input.error,textarea.error{border-color:var(--red)}
input.success,textarea.success{border-color:#22c55e}
.field-error{font-size:.8125rem;color:var(--red);margin-top:.2rem}
.form-success-msg{background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.25);border-radius:var(--radius-lg);padding:2rem;text-align:center;margin-top:1rem}
.success-icon{font-size:2.5rem;display:block;margin-bottom:.75rem}
.form-success-msg strong{display:block;font-size:1.125rem;margin-bottom:.5rem}
.form-success-msg p{font-size:.9375rem;color:var(--gray-600)}
.contact-info-card{background:var(--gray-100);border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:2rem;margin-bottom:1.5rem}
.contact-info-card h3{font-size:1.125rem;font-weight:700;margin-bottom:1.5rem}
.contact-methods{display:flex;flex-direction:column;gap:.875rem}
.contact-method{display:flex;align-items:center;gap:1rem;padding:1rem;background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg);transition:all .2s;cursor:pointer}
.contact-method:hover{border-color:var(--red);transform:translateX(4px)}
.contact-method--wa:hover{border-color:#25D366}
.method-icon{width:44px;height:44px;background:rgba(224,30,44,.1);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:var(--red);flex-shrink:0}
.method-icon--wa{background:rgba(37,211,102,.1);color:#25D366}
.contact-method strong{display:block;font-size:.9rem;font-weight:700;color:var(--black)}
.contact-method span{font-size:.875rem;color:var(--gray-400)}
.contact-address{display:flex;align-items:flex-start;gap:.625rem;font-size:.9rem;color:var(--gray-600);margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--gray-200)}
.contact-address svg{color:var(--red);flex-shrink:0;margin-top:2px}
.trust-reasons{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:1.75rem}
.trust-reasons h3{font-size:1rem;font-weight:700;margin-bottom:1rem}
.trust-list{display:flex;flex-direction:column;gap:.625rem}
.trust-list li{display:flex;align-items:center;gap:.625rem;font-size:.9375rem;color:var(--gray-600)}
.trust-check{color:var(--red);font-weight:700;font-size:1rem;flex-shrink:0}

/* ── GENERIC PAGE ── */
.prose-page{max-width:820px}
.prose-section{max-width:900px;margin:0 auto;font-size:1.0625rem;color:var(--gray-600);line-height:1.85}
.section-img{border-radius:var(--radius-xl);margin-top:2rem;width:100%}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .content-grid{grid-template-columns:1fr;gap:2rem}
  .aside-card{position:static}
  .article-layout{grid-template-columns:1fr;gap:2rem}
  .article-sidebar{position:static}
  .featured-posts{grid-template-columns:1fr}
  .featured-post--large{grid-row:auto}
  .contact-layout{grid-template-columns:1fr;gap:3rem}
}
@media(max-width:768px){
  .page-hero{padding:6rem 0 3.5rem;min-height:auto}
  .form-row{grid-template-columns:1fr}
  .cta-band-inner{flex-direction:column;align-items:flex-start}
  .stats-row{justify-content:center;gap:1.5rem}
}

/* ═══════════════════════════════════════════
   TEAM CARDS — full social links
   ═══════════════════════════════════════════ */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.5rem;margin-top:1.5rem}
.team-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:2rem;text-align:center;transition:all .35s var(--spring)}
.team-card:hover{box-shadow:var(--shadow-md);transform:translateY(-6px)}
.team-photo-wrap{margin:0 auto 1.25rem;width:100px;height:100px}
.team-photo{width:100px;height:100px;border-radius:50%;object-fit:cover;border:3px solid rgba(224,30,44,.15)}
.team-photo-placeholder{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,var(--red),var(--red-dark));color:#fff;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:700;font-family:var(--font-display)}
.team-info{display:flex;flex-direction:column;align-items:center}
.team-name{font-size:1.0625rem;font-weight:700;color:var(--black);margin-bottom:.25rem}
.team-role{font-size:.875rem;color:var(--red);font-weight:600;margin-bottom:.75rem}
.team-bio{font-size:.875rem;color:var(--gray-600);line-height:1.6;margin-bottom:1rem;text-align:center}

/* Social links row */
.team-socials{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-top:.25rem}
.team-social-link{width:34px;height:34px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;transition:all .2s;border:1px solid var(--gray-200);color:var(--gray-600)}
.team-social-link:hover{transform:translateY(-2px)}
/* Platform-specific colours on hover */
.team-social-link--linkedin:hover{background:#0A66C2;border-color:#0A66C2;color:#fff}
.team-social-link--twitter:hover{background:#000;border-color:#000;color:#fff}
.team-social-link--instagram:hover{background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);border-color:#cc2366;color:#fff}
.team-social-link--facebook:hover{background:#1877F2;border-color:#1877F2;color:#fff}
.team-social-link--website:hover{background:var(--red);border-color:var(--red);color:#fff}

/* ── SERVICES INDEX ── */
.services-index-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:1.5rem; }
.svc-index-card { background:#fff; border-radius:var(--radius-xl); padding:2rem; transition:all .3s var(--spring); }
.svc-index-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-4px); }
.svc-index-icon { width:52px; height:52px; background:rgba(224,30,44,.08); border-radius:var(--radius-lg); display:flex; align-items:center; justify-content:center; color:var(--red); margin-bottom:1.25rem; transition:all .3s; }
.svc-index-card:hover .svc-index-icon { background:var(--red); color:#fff; }
.svc-index-title { font-size:1.125rem; font-weight:700; margin-bottom:.5rem; }
.svc-index-title a:hover { color:var(--red); }
.svc-index-tagline { font-size:.9rem; color:var(--gray-600); margin-bottom:1rem; line-height:1.6; }
.svc-index-subs { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.25rem; }
.svc-index-subs li a { font-size:.8rem; background:var(--gray-100); color:var(--gray-600); padding:.2rem .625rem; border-radius:100px; transition:all .2s; display:block; }
.svc-index-subs li a:hover { background:rgba(224,30,44,.1); color:var(--red); }
.svc-index-link { display:inline-flex; align-items:center; gap:.375rem; font-size:.875rem; font-weight:600; color:var(--red); }

/* ── CTA BAND ── */
.cta-band-inner { display:flex; align-items:center; justify-content:space-between; gap:3rem; flex-wrap:wrap; }

/* ═══════════════════════════════════════════
   TEAM CARDS V2 — Futuristic Full-Photo Design
   ═══════════════════════════════════════════ */
.team-section { background: var(--black-soft); }
.team-section .section-label--auto { color: rgba(255,255,255,.5); }
.team-section .section-label { color: rgba(255,255,255,.5); }
.team-section .section-title { color: #fff; }
.team-section .section-subtitle { color: rgba(255,255,255,.55); }

.team-cards-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5rem;
  margin-top: 1rem;
  max-width: 800px;
}

/* Card container */
.team-card-v2 {
  position: relative;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--black);
  cursor: default;
  transition: transform .4s var(--spring), box-shadow .4s var(--spring);
  aspect-ratio: 4/5;
  display: flex;
  flex-direction: column;
}
.team-card-v2:hover {
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 32px 72px rgba(0,0,0,.5), 0 0 0 1px rgba(224,30,44,.3);
}

/* Photo — fills the card */
.tcv2-photo-wrap {
  position: absolute;
  inset: 0;
}
.tcv2-photo {
  width: 100%; height: 100%;
  object-fit: cover; object-position: top center;
  display: block;
  transition: transform .6s var(--spring);
}
.team-card-v2:hover .tcv2-photo {
  transform: scale(1.05);
}

/* Fallback when no photo */
.tcv2-fallback {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, #1a0005 0%, #3d0010 50%, #1a0005 100%);
  display: flex; align-items: center; justify-content: center;
}
.tcv2-initial {
  font-family: var(--font-display);
  font-size: 6rem; font-weight: 700;
  color: rgba(224,30,44,.4);
  user-select: none;
}

/* Gradient overlay — bottom-to-top so info is readable */
.tcv2-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to top,
    rgba(10,10,10,.97) 0%,
    rgba(10,10,10,.65) 40%,
    rgba(10,10,10,.1) 70%,
    transparent 100%
  );
  transition: opacity .4s var(--spring);
}
.team-card-v2:hover .tcv2-overlay {
  background: linear-gradient(
    to top,
    rgba(10,10,10,.98) 0%,
    rgba(10,10,10,.7) 50%,
    rgba(10,10,10,.2) 75%,
    transparent 100%
  );
}

/* Info bar — sits at the bottom */
.tcv2-info {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 1.75rem 1.75rem 1.5rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  z-index: 2;
}
.tcv2-text { flex: 1; min-width: 0; }
.tcv2-name {
  font-size: 1.25rem; font-weight: 700;
  color: #fff; margin: 0 0 .25rem;
  font-family: var(--font-sans);
  line-height: 1.2;
}
.tcv2-role {
  display: block; font-size: .8125rem; font-weight: 600;
  color: var(--red-light); letter-spacing: .04em;
  text-transform: uppercase;
}

/* Social icons — stacked vertically on the right */
.tcv2-socials {
  display: flex; flex-direction: column; gap: .5rem;
  opacity: 0; transform: translateX(12px);
  transition: opacity .35s var(--spring), transform .35s var(--spring);
}
.team-card-v2:hover .tcv2-socials {
  opacity: 1; transform: translateX(0);
}
.tcv2-soc {
  width: 38px; height: 38px;
  border-radius: var(--radius);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.15);
  transition: all .2s var(--spring);
  text-decoration: none;
}
.tcv2-soc:hover { transform: scale(1.1); }
.tcv2-soc--li:hover  { background: #0A66C2; border-color: #0A66C2; color: #fff; }
.tcv2-soc--tw:hover  { background: #000;    border-color: #333;    color: #fff; }
.tcv2-soc--ig:hover  {
  background: linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
  border-color: #cc2366; color: #fff;
}
.tcv2-soc--web:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* Bio drawer — slides up on hover */
.tcv2-bio-drawer {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 1rem 1.75rem;
  background: rgba(10,10,10,.92);
  transform: translateY(100%);
  transition: transform .4s var(--spring);
  z-index: 3;
  border-top: 1px solid rgba(224,30,44,.2);
}
.team-card-v2:hover .tcv2-bio-drawer {
  transform: translateY(0);
}
.tcv2-bio-drawer p {
  font-size: .875rem; color: rgba(255,255,255,.7);
  line-height: 1.65; margin: 0;
}

/* Accent corner glow */
.team-card-v2::after {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 80px; height: 80px;
  background: radial-gradient(circle at top right, rgba(224,30,44,.25), transparent 70%);
  opacity: 0;
  transition: opacity .4s var(--spring);
  z-index: 1;
  pointer-events: none;
}
.team-card-v2:hover::after { opacity: 1; }

/* Responsive */
@media(max-width:768px) {
  .team-cards-row { grid-template-columns: 1fr; max-width: 400px; }
  .team-card-v2 { aspect-ratio: 3/4; }
  .tcv2-socials { opacity: 1; transform: none; }
  .tcv2-bio-drawer { position: static; transform: none; background: rgba(10,10,10,.8); }
}

/* ═══════════════════════════════════════════
   THANK YOU PAGE
   ═══════════════════════════════════════════ */
.thankyou-section {
  min-height: 70vh; display:flex; align-items:center; justify-content:center;
  padding:6rem 0; background:var(--off-white);
}
.thankyou-inner {
  max-width:580px; text-align:center;
}
.ty-icon {
  width:80px; height:80px; background:rgba(34,197,94,.1); border-radius:50%;
  display:flex; align-items:center; justify-content:center; margin:0 auto 2rem;
}
.ty-check { color:#22c55e; }
.ty-title {
  font-family:var(--font-display); font-size:clamp(2rem,4vw,3rem);
  font-weight:700; color:var(--black); margin-bottom:1rem;
}
.ty-msg { font-size:1.125rem; color:var(--gray-600); line-height:1.7; margin-bottom:.75rem; }
.ty-sub { font-size:1rem; color:var(--gray-400); margin-bottom:2.5rem; }
.ty-actions { display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; margin-bottom:2rem; }
.ty-whatsapp { font-size:.9375rem; color:var(--gray-400); }
.ty-wa-link { color:#25D366; font-weight:600; display:inline-flex; align-items:center; gap:.375rem; }
.ty-wa-link:hover { color:#1DAA52; }

/* ═══════════════════════════════════════════
   CASE STUDY DETAIL PAGE
   ═══════════════════════════════════════════ */
.cs-detail-cover { background:var(--gray-100); padding:2rem 0; }
.cs-detail-img { border-radius:var(--radius-xl); width:100%; max-height:500px; object-fit:cover; }
.cs-detail-layout { display:grid; grid-template-columns:1fr 320px; gap:4rem; padding:4rem 0; }
.cs-detail-body h2 {
  font-family:var(--font-display); font-size:1.5rem; font-weight:700;
  color:var(--black); margin:2.5rem 0 1rem; letter-spacing:-.02em;
}
.cs-detail-body h2:first-child { margin-top:0; }
.cs-prose { font-size:1rem; color:var(--gray-600); line-height:1.85; }
.cs-prose p { margin-bottom:1rem; }
.cs-result-highlight {
  display:flex; align-items:center; gap:.75rem; padding:1.25rem 1.5rem;
  background:rgba(224,30,44,.06); border-radius:var(--radius-lg);
  font-size:1.0625rem; font-weight:700; color:var(--red); margin-bottom:1.5rem;
}
.cs-detail-sidebar { display:flex; flex-direction:column; gap:1.5rem; position:sticky; top:100px; }
.cs-sidebar-card { background:var(--gray-100); border-radius:var(--radius-xl); padding:1.75rem; }
.cs-sidebar-card h3 { font-size:1rem; font-weight:700; margin-bottom:.75rem; color:var(--black); }
.cs-sidebar-card p { font-size:.9rem; color:var(--gray-600); line-height:1.6; margin-bottom:1.25rem; }
.cs-sidebar-link {
  display:flex; flex-direction:column; gap:.2rem; padding:.75rem 0;
  border-bottom:1px solid var(--gray-200); transition:color .2s;
}
.cs-sidebar-link:last-child { border-bottom:none; }
.cs-sidebar-link:hover { color:var(--red); }
.cs-sidebar-link strong { font-size:.9rem; font-weight:600; color:var(--black); line-height:1.3; }
.cs-sidebar-link span { font-size:.8125rem; color:var(--gray-400); display:flex; align-items:center; gap:.3rem; }
.cs-sidebar-link:hover strong { color:var(--red); }
.cs-read-more {
  display:inline-flex; align-items:center; gap:.375rem;
  font-size:.875rem; font-weight:600; color:var(--red);
  margin-top:.875rem; transition:gap .2s var(--spring);
}
.cs-read-more:hover { gap:.75rem; }
/* cs-tile-tag in hero */
.cs-tile-tag--hero { position:static; display:inline-block; margin-bottom:1rem; }

/* ═══════════════════════════════════════════
   INDUSTRY PAGES
   ═══════════════════════════════════════════ */
.ind-list-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1rem; }
.ind-list-card {
  display:flex; align-items:center; gap:1.25rem; padding:1.5rem;
  background:var(--white); border-radius:var(--radius-xl);
  border:1px solid var(--gray-200); transition:all .3s var(--spring);
  text-decoration:none; color:inherit;
}
.ind-list-card:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); border-color:rgba(224,30,44,.2); }
.ilc-icon {
  width:48px; height:48px; flex-shrink:0; background:rgba(224,30,44,.08);
  border-radius:var(--radius-lg); display:flex; align-items:center;
  justify-content:center; color:var(--red); transition:all .3s;
}
.ind-list-card:hover .ilc-icon { background:var(--red); color:#fff; }
.ilc-body { flex:1; min-width:0; }
.ilc-body h2, .ilc-body h3 { font-size:1rem; font-weight:700; color:var(--black); margin-bottom:.25rem; line-height:1.3; }
.ilc-body p { font-size:.8125rem; color:var(--gray-400); margin:0; line-height:1.4; }
.ilc-arrow { color:var(--gray-200); flex-shrink:0; transition:all .3s; }
.ind-list-card:hover .ilc-arrow { color:var(--red); transform:translateX(4px); }

/* ═══════════════════════════════════════════
   HERO HEADLINE — highlighted words
   ═══════════════════════════════════════════ */
.hero-headline em.hero-headline-accent {
  /* Already styled as red. Now also add slight background highlight */
  background: linear-gradient(120deg, rgba(224,30,44,.12) 0%, rgba(224,30,44,.08) 100%);
  border-radius:4px; padding:0 .2em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* ═══════════════════════════════════════════
   HERO TRUST BAR — pill style
   ═══════════════════════════════════════════ */
.hbar-item--pill {
  background:rgba(224,30,44,.07);
  color:var(--black);
  border:1px solid rgba(224,30,44,.15);
  border-radius:100px;
  padding:.3rem .875rem;
  font-size:.8125rem;
  font-weight:600;
  letter-spacing:.02em;
  transition:all .2s;
}
.hbar-item--pill:hover { background:rgba(224,30,44,.12); }

/* ═══════════════════════════════════════════
   SERVICE ROW SUB LINKS
   ═══════════════════════════════════════════ */
.service-row-sub-link {
  font-size:.75rem; font-weight:500;
  background:var(--gray-100); color:var(--gray-500);
  padding:.2rem .625rem; border-radius:100px;
  transition:all .3s; text-decoration:none;
  display:inline-block;
}
.service-row:hover .service-row-sub-link {
  background:rgba(224,30,44,.08); color:var(--red);
}
.service-row-sub-link:hover {
  background:var(--red) !important; color:#fff !important;
  transform:translateY(-1px);
}

/* ═══════════════════════════════════════════
   FOOTER SENTENCE-STYLE LINKS
   ═══════════════════════════════════════════ */
.footer-link--sentence {
  font-size:.8125rem;
  color:rgba(255,255,255,.45);
  line-height:1.6;
  font-style:normal;
}
.footer-link--sentence:hover { color:rgba(255,255,255,.85); padding-left:4px; }

/* ═══════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════ */
@media(max-width:1024px) {
  .cs-detail-layout { grid-template-columns:1fr; gap:2rem; }
  .cs-detail-sidebar { position:static; }
}
@media(max-width:768px) {
  .ind-list-grid { grid-template-columns:1fr; }
  .ty-actions { flex-direction:column; align-items:center; }
}