/* ════════════ BIGGER CARD TITLES ════════════ */
.page-portfolio .wc-client,.page-portfolio .portfolio-content .wc-client { font-size:clamp(1.3rem,2vw,1.65rem) !important; line-height:1.15; margin-top:.55rem; }
.page-portfolio .wc-tagline { font-size:.92rem; margin-top:.4rem; }
.page-portfolio .lb-title { font-size:clamp(1.7rem,3vw,2.2rem); }
.page-team .tm-info h3 { font-size:1.6rem; }
.page-about .ab-diff-card h4 { font-size:1.25rem; }

/* ════════════ BLOG ════════════ */
.page-blog .blog-filter-bar { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; margin-bottom:2.2rem; }
.page-blog .blog-filter-chip { display:inline-flex; align-items:center; gap:.45rem; padding:.55rem 1rem; border:1px solid var(--line); border-radius:100px; background:var(--glass); color:var(--ink); text-decoration:none; font-size:.88rem; font-weight:500; transition:background .3s,border-color .3s,box-shadow .3s; }
.page-blog .blog-filter-chip:hover { background:var(--glass-2); }
/* Same on-brand 3-stop gradient + glow as the primary buttons elsewhere
   (e.g. .btn-submit) — the old version used raw rgba blue instead of the
   site's cyan-violet-pink palette and read as a washed-out, off-brand grey. */
.page-blog .blog-filter-chip.active { background:linear-gradient(120deg,var(--n-blue),var(--n-violet) 55%,var(--n-pink)); border-color:transparent; color:#fff; box-shadow:0 10px 28px -10px rgba(139,92,246,.7); }
.page-blog .blog-filter-chip span { font-size:.7rem; font-weight:700; color:#bfe9f5; background:rgba(255,255,255,.08); border-radius:100px; padding:.1rem .45rem; }
.page-blog .blog-filter-chip.active span { color:#fff; background:rgba(255,255,255,.22); }
.page-blog .blog-filter-active-label { color:var(--muted); font-size:.9rem; }
.page-blog .blog-search-form { display:flex; margin-left:auto; border:1px solid var(--line); border-radius:100px; background:var(--glass); overflow:hidden; }
.page-blog .blog-search-input { background:none; border:0; color:var(--ink); padding:.6rem 1rem; font-family:var(--body); font-size:.88rem; outline:none; width:200px; }
.page-blog .blog-search-btn { background:none; border:0; color:#bfe9f5; padding:0 1rem; cursor:pointer; }
.page-blog .blog-featured-card { display:grid; grid-template-columns:1.1fr .9fr; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--bg-2); text-decoration:none; color:var(--ink); margin-bottom:2.4rem; transition:transform .4s var(--ease),border-color .4s,box-shadow .4s; }
.page-blog .blog-featured-card:hover { transform:translateY(-5px); border-color:rgba(255,255,255,.22); box-shadow:0 30px 64px -30px rgba(139,92,246,.55); }
.page-blog .blog-featured-img { min-height:300px; background-size:cover; background-position:center; }
.page-blog .blog-featured-body { padding:2.2rem; display:flex; flex-direction:column; gap:.9rem; }
.page-blog .blog-featured-tag { font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--n-gold); }
.page-blog .blog-featured-body h2 { font-family:var(--disp); font-weight:800; font-size:clamp(1.6rem,3vw,2.3rem); line-height:1.12; letter-spacing:-.02em; margin:0; }
.page-blog .blog-featured-body p { color:var(--muted); line-height:1.6; margin:0; }
.page-blog .blog-read-link { font-weight:600; color:#bfe9f5; font-size:.92rem; }
.page-blog .blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.page-blog .blog-card { border:1px solid var(--line); border-radius:20px; overflow:hidden; background:var(--bg-2); text-decoration:none; color:var(--ink); transition:transform .4s var(--ease),border-color .4s,box-shadow .4s; display:flex; flex-direction:column; }
.page-blog .blog-card:hover { transform:translateY(-6px); border-color:rgba(255,255,255,.22); box-shadow:0 28px 56px -28px rgba(139,92,246,.5); }
.page-blog .blog-card-img { position:relative; aspect-ratio:16/9; background-size:cover; background-position:center; }
.page-blog .blog-card-cat { position:absolute; top:.9rem; left:.9rem; font-size:.66rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:.3rem .7rem; border-radius:100px; color:#fff; background:rgba(59,70,255,.45); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(6px); }
.page-blog .blog-card-body { padding:1.3rem 1.4rem 1.5rem; display:flex; flex-direction:column; gap:.6rem; flex:1; }
.page-blog .blog-card-body h3 { font-family:var(--disp); font-weight:700; font-size:1.35rem; line-height:1.2; letter-spacing:-.01em; margin:0; }
.page-blog .blog-card-body p { color:var(--muted); font-size:.9rem; line-height:1.55; margin:0; flex:1; }
.page-blog .blog-card-meta { display:flex; align-items:center; gap:.5rem; color:var(--faint); font-size:.78rem; }
.page-blog .blog-card-meta .dot { opacity:.6; }

/* ════════════ CONTACT ════════════ */
.page-contact .contact-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:3rem; align-items:start; }
.page-contact .contact-info h2 { font-family:var(--disp); font-weight:800; font-size:clamp(1.7rem,3.4vw,2.5rem); letter-spacing:-.02em; line-height:1.08; margin:0 0 .8rem; }
.page-contact .contact-info > p { color:var(--muted); line-height:1.65; margin:0 0 1.8rem; }
.page-contact .contact-cards { display:grid; gap:.9rem; }
.page-contact .contact-card { display:flex; gap:1rem; align-items:flex-start; padding:1.3rem 1.4rem; border:1px solid var(--line); border-radius:20px; background:var(--glass); transition:border-color .3s,background .3s; }
.page-contact .contact-card:hover { background:var(--glass-2); border-color:rgba(255,255,255,.2); }
.page-contact .contact-card-icon { flex-shrink:0; width:46px; height:46px; border-radius:14px; display:grid; place-items:center; color:#bfe9f5; background:rgba(34,211,238,.12); border:1px solid rgba(34,211,238,.3); }
.page-contact .contact-card-icon svg { width:22px; height:22px; }
.page-contact .contact-card h4 { font-family:var(--disp); font-weight:700; font-size:1.02rem; margin:0 0 .3rem; }
.page-contact .contact-card a { color:#bfe9f5; text-decoration:none; font-size:.92rem; }
.page-contact .contact-card a:hover { color:#fff; }
.page-contact .contact-card p { color:var(--muted); font-size:.92rem; margin:0; line-height:1.5; }
.page-contact .btn-whatsapp { display:inline-flex; align-items:center; gap:.6rem; padding:1rem 1.7rem; border-radius:100px; background:#25D366; color:#04210f; font-weight:700; text-decoration:none; margin-top:1.4rem; transition:background .3s,transform .3s; }
.page-contact .btn-whatsapp:hover { background:#2af077; transform:translateY(-2px); }
.page-contact .contact-form-card { padding:2.2rem; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(160deg,rgba(59,70,255,.08),rgba(244,63,157,.04)); backdrop-filter:blur(10px); }
.page-contact .contact-form-card h3 { font-family:var(--disp); font-weight:800; font-size:1.5rem; margin:0 0 .5rem; }
.page-contact .contact-form-card > p { color:var(--muted) !important; }
.page-contact .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.page-contact .form-group { display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.1rem; }
.page-contact .form-group label { font-size:.82rem; font-weight:600; color:#d4d1e4; }
.page-contact .required { color:var(--n-pink); }
.page-contact .form-group input,.page-contact .form-group select,.page-contact .form-group textarea { background:rgba(255,255,255,.05); border:1px solid var(--line); border-radius:14px; color:var(--ink); padding:.85rem 1rem; font-family:var(--body); font-size:.93rem; outline:none; transition:border-color .3s,box-shadow .3s; width:100%; }
.page-contact .form-group input:focus,.page-contact .form-group select:focus,.page-contact .form-group textarea:focus { border-color:var(--n-cyan); box-shadow:0 0 0 3px rgba(34,211,238,.15); }
.page-contact .form-group select option { background:#0a0814; }
.page-contact .form-error { color:var(--n-pink); font-size:.76rem; min-height:1em; }
.page-contact .char-counter { color:var(--faint); font-size:.74rem; text-align:right; }
.page-contact .btn-submit { width:100%; display:inline-flex; align-items:center; justify-content:center; gap:.6rem; padding:1.1rem; border:0; border-radius:100px; cursor:pointer; font-family:var(--body); font-weight:700; font-size:1rem; color:#fff; background:linear-gradient(120deg,var(--n-blue),var(--n-violet) 55%,var(--n-pink)); background-size:180% 180%; box-shadow:0 12px 38px -12px rgba(139,92,246,.8); transition:background-position .35s,box-shadow .35s; }
.page-contact .btn-submit:hover { background-position:100% 0; box-shadow:0 18px 50px -12px rgba(244,63,157,.85); }
.page-contact .btn-submit svg { width:18px; height:18px; }
.page-contact .form-footnote { color:var(--faint); font-size:.78rem; margin-top:1rem; text-align:center; }
.page-contact .alert { padding:1rem 1.2rem; border-radius:14px; margin-bottom:1.2rem; font-size:.92rem; }
.page-contact .alert-success { background:rgba(37,211,102,.12); border:1px solid rgba(37,211,102,.4); color:#7ef0a8; }
.page-contact .alert-error { background:rgba(244,63,157,.1); border:1px solid rgba(244,63,157,.4); color:#ff9ccd; }
.page-contact .ct-map { position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); height:440px; }
.page-contact .ct-map iframe { width:100%; height:100%; border:0; filter:grayscale(.25) contrast(1.02); }
.page-contact .ct-map-badge { position:absolute; left:1.2rem; bottom:1.2rem; z-index:2; padding:.9rem 1.2rem; border-radius:16px; background:rgba(10,8,20,.85); border:1px solid var(--line); backdrop-filter:blur(12px); }
.page-contact .ct-map-badge strong { font-family:var(--disp); display:block; font-size:.95rem; }
.page-contact .ct-map-badge span { color:var(--muted); font-size:.8rem; }

@media (max-width:1000px){
  .page-blog .blog-grid { grid-template-columns:1fr 1fr; }
  .page-blog .blog-featured-card { grid-template-columns:1fr; }
  .page-blog .blog-featured-img { min-height:220px; }
  .page-contact .contact-grid { grid-template-columns:1fr; }
}
@media (max-width:600px){
  .page-blog .blog-grid { grid-template-columns:1fr; }
  .page-blog .blog-search-form { margin-left:0; width:100%; }
  .page-blog .blog-search-input { flex:1; }
  .page-contact .form-row { grid-template-columns:1fr; }
  .page-contact .ct-map { height:320px; }
}
