/* ============================================================
   MyTrafficBuzz — Article

   Long-form page styling: the page hero and article body.

   Part of the split of the former single style.css (20-Aug-2026).
   Load order matters: see the <link> block in any page head, and
   keep this file in that same position when adding rules.
   ============================================================ */

/* ---------- page hero (ct-hero) ---------- */
.contact__hero{background:var(--g1);padding:66px 0 58px;color:var(--wh);position:relative;overflow:hidden;margin-bottom:44px;border-radius:var(--r)}
.contact__hero::before{content:'';position:absolute;inset:-12%;background:var(--aur);animation:aurora 16s ease-in-out infinite;will-change:transform}
.contact__hero::after{content:none}
.contact__hero h1{font-size:clamp(30px,3.8vw,48px);margin-bottom:14px;padding:0 36px;color:#fff;font-weight:800;letter-spacing:-.028em;line-height:1.08;position:relative}
.contact__hero h1 span{color:var(--gold)}
.contact__hero p{padding:0 36px;font-size:16.5px;color:rgba(255,255,255,.85);max-width:660px;margin-bottom:8px;position:relative}
.breadcrumbs{display:flex;align-items:center;gap:7px;font-size:13px;margin-bottom:16px;flex-wrap:wrap;padding:0 36px;color:rgba(255,255,255,.62);position:relative}
.breadcrumbs a{color:var(--gold)}
.breadcrumbs a:hover{text-decoration:underline}

/* ---------- article body ---------- */
.contact__body{color:var(--txt)}
.contact__body h2{font-size:27px;color:var(--pri);margin:40px 0 14px;font-weight:700;letter-spacing:-.018em}
.contact__body h3{font-size:20px;color:var(--acc2);margin:28px 0 10px}
.contact__body p{margin-bottom:15px;font-size:16px;color:var(--txt);text-align:left;line-height:1.75}
.contact__body ul,.contact__body ol{margin:14px 0 16px 26px}
.contact__body li{margin-bottom:8px;font-size:16px;color:var(--txt);text-align:left;line-height:1.7}
.contact__info,.contact__info h3,.contact__info p,.contact__info div,.contact__info a{color:#fff}
.contact__info .contact__info-value a{color:var(--gold)}
.contact__info .whatsapp-qr p{color:rgba(255,255,255,.6)}
.contact__body .state-card__top h3{color:#fff}
.contact__body .state-card__top span{color:rgba(255,255,255,.75)}
.contact__body .state-card .state-card__body p{color:var(--txt)}
.related-services__item{margin-top:44px;padding:28px;background:var(--lt);border-radius:var(--r);border:1px solid var(--line)}
.related-services__item h3{font-size:20px;color:var(--pri);margin-bottom:16px}
.related-services{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.related-services a{padding:13px 16px;background:var(--card);border:1px solid var(--line);border-radius:11px;font-size:14px;font-weight:500;color:var(--txt);transition:var(--t)}
.related-services a:hover{color:var(--acc);border-color:rgba(226,58,78,.55);transform:translateY(-2px);box-shadow:var(--sh)}
