/* =====================================================
   RESPONSIVE WEB DESIGN PAGE — rwd- prefix
   Teal/Cyan theme
   ===================================================== */

.rwd-hero {
  background: linear-gradient(135deg,#042f2e 0%,#0f766e 35%,#0891b2 65%,#0ea5e9 100%);
  padding: 130px 0 90px;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.rwd-orb {
  position: absolute; border-radius: 50%;
  pointer-events: none; filter: blur(90px);
}
.rwd-orb.o1 { width:500px;height:500px;background:rgba(14,165,233,.3);top:-120px;right:-80px; }
.rwd-orb.o2 { width:350px;height:350px;background:rgba(8,145,178,.2);bottom:-80px;left:-60px; }
.rwd-orb.o3 { width:200px;height:200px;background:rgba(103,232,249,.15);top:40%;left:40%; }

.rwd-hero-grid {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 60px; align-items: start;
}
.rwd-breadcrumb {
  display: flex; align-items: center; gap: 6px;
  font-size: .82rem; color: rgba(255,255,255,.55);
  margin-bottom: 22px; flex-wrap: wrap;
}
.rwd-breadcrumb a { color: rgba(255,255,255,.55); text-decoration: none; }
.rwd-breadcrumb a:hover { color: #fff; }
.rwd-breadcrumb svg { width:14px;height:14px;flex-shrink:0; }

.rwd-hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18);
  border-radius: 50px; padding: 6px 16px;
  font-size: .8rem; font-weight: 700; letter-spacing: .06em;
  color: #a5f3fc; margin-bottom: 22px;
}
.rwd-hero-badge .dot {
  width:7px;height:7px;border-radius:50%;background:#67e8f9;
  box-shadow:0 0 0 3px rgba(103,232,249,.3);
  animation:rwdPulse 2s infinite;
}
@keyframes rwdPulse {
  0%,100%{box-shadow:0 0 0 3px rgba(103,232,249,.3)}
  50%{box-shadow:0 0 0 6px rgba(103,232,249,.08)}
}
.rwd-hero h1 {
  font-family: var(--font-head,'Bricolage Grotesque',sans-serif);
  font-size: clamp(32px,4.5vw,52px);
  font-weight: 800; line-height: 1.1; margin-bottom: 20px;
}
.rwd-hero h1 .grad {
  background: linear-gradient(90deg,#a5f3fc,#cffafe,#e0f2fe);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.rwd-hero h1 .accent-line { display:block;color:#fff; }

.rwd-trust-row { display:flex;flex-wrap:wrap;gap:14px;margin-top:24px; }
.rwd-trust { display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.85);font-size:13px;font-weight:500; }
.rwd-trust svg { width:15px;height:15px;color:#a5f3fc;flex-shrink:0; }

/* ── URGENCY CARD ── */
.rwd-urgency-card { position:relative;display:block;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(14px);padding:14px 18px;border-radius:16px;margin-bottom:28px;max-width:480px;overflow:hidden; }
.rwd-urgency-card::before { content:"";position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(165,243,252,.15),transparent);animation:rwdUrgShimmer 5s ease-in-out infinite;pointer-events:none; }
@keyframes rwdUrgShimmer { 0%{left:-100%} 60%,100%{left:120%} }
.rwd-urg-row { display:flex;align-items:center;gap:12px;margin-bottom:10px;position:relative;z-index:1;flex-wrap:wrap; }
.rwd-urg-live { display:inline-flex;align-items:center;gap:6px;background:rgba(239,68,68,.18);border:1px solid rgba(239,68,68,.5);color:#fca5a5;padding:3px 10px;border-radius:100px;font-size:10.5px;font-weight:800;letter-spacing:2px; }
.rwd-urg-pulse { width:7px;height:7px;background:#ef4444;border-radius:50%;box-shadow:0 0 10px #ef4444;animation:pulse 1.2s infinite;flex-shrink:0; }
.rwd-urg-text { font-size:13.5px;color:rgba(255,255,255,.92);font-weight:500;line-height:1.3; }
.rwd-urg-text strong { color:#fbbf24;font-weight:800; }
.rwd-urg-bar { position:relative;width:100%;height:6px;background:rgba(255,255,255,.12);border-radius:3px;overflow:hidden;margin-bottom:12px;z-index:1; }
.rwd-urg-fill { position:absolute;left:0;top:0;height:100%;width:58%;background:linear-gradient(90deg,#67e8f9,#22d3ee 60%,#0ea5e9);border-radius:3px;animation:rwdUrgFill 1.6s cubic-bezier(.65,0,.35,1) .4s both;box-shadow:0 0 12px rgba(34,211,238,.5); }
@keyframes rwdUrgFill { from{width:0} to{width:58%} }
.rwd-urg-meta { display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:1;flex-wrap:wrap; }
.rwd-urg-avatars { display:flex;align-items:center; }
.rwd-urg-av { width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#0891b2,#22d3ee);color:#fff;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid rgba(0,0,0,.3);margin-left:-8px;flex-shrink:0; }
.rwd-urg-meta-text { display:flex;align-items:center;gap:5px;font-size:12px;color:rgba(255,255,255,.65);font-weight:500; }
.rwd-urg-meta-text svg { width:12px;height:12px;flex-shrink:0;color:#67e8f9; }
.rwd-urg-meta-text strong { color:#fff; }

/* ── ROTATOR ── */
.rwd-rotator-wrap { display:flex;align-items:center;gap:10px;font-size:1.08rem;color:rgba(255,255,255,.7);margin-bottom:20px;font-weight:500; }
.rwd-rotator { display:inline-block;min-width:220px; }
.rwd-rotator span { display:block;font-weight:800;color:#a5f3fc;animation:rwdFade 12s infinite; }
.rwd-rotator span:not(:first-child) { display:none; }
@keyframes rwdFade { 0%,22%{opacity:1;transform:translateY(0)} 27%,100%{opacity:0;transform:translateY(-10px)} }

/* ── CTA ROW ── */
.rwd-cta-row { display:flex;gap:14px;flex-wrap:wrap;margin-bottom:28px; }
.rwd-btn { display:inline-flex;align-items:center;gap:8px;padding:13px 26px;border-radius:10px;font-size:.95rem;font-weight:700;text-decoration:none;transition:.2s; }
.rwd-btn-wa { background:#25D366;color:#fff; }
.rwd-btn-wa:hover { background:#1da851;color:#fff; }
.rwd-btn-outline { background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.3);color:#fff; }
.rwd-btn-outline:hover { background:rgba(255,255,255,.15);color:#fff; }

/* ── HERO FORM ── */
.rwd-hero-form-wrap { position:relative; }
.rwd-hero-form {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15);
  backdrop-filter: blur(18px); border-radius: 20px; padding: 32px 28px;
}
.rwd-hero-form h3 { color:#fff;font-size:1.2rem;font-weight:800;margin-bottom:6px; }
.form-sub-hero { color:rgba(255,255,255,.65);font-size:.82rem;margin-bottom:18px; }
.rwd-hero-form-submit {
  width:100%;padding:13px;background:linear-gradient(135deg,#0ea5e9,#0891b2);
  color:#fff;border:none;border-radius:10px;font-size:.95rem;font-weight:800;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;
  transition:.2s;margin-top:4px;
}
.rwd-hero-form-submit:hover { background:linear-gradient(135deg,#0284c7,#0369a1); }
.rwd-hero-form-trust { font-size:.75rem;color:rgba(255,255,255,.5);text-align:center;margin-top:10px;display:flex;align-items:center;justify-content:center;gap:5px; }
.rwd-hero-form-success { display:none;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.4);color:#86efac;border-radius:8px;padding:12px;margin-top:12px;font-size:.88rem;text-align:center; }

/* ── MARQUEE ── */
.rwd-marquee { padding: 20px 0; overflow: hidden; border-top: 1px solid rgba(0,0,0,.06); border-bottom: 1px solid rgba(0,0,0,.06); background: #f0fdfe; }
.rwd-marquee-label { font-size:.78rem;font-weight:700;letter-spacing:.08em;color:#0891b2;text-align:center;text-transform:uppercase;margin-bottom:12px; }
.rwd-marquee-track { display:flex;gap:0;white-space:nowrap;animation:rwdMarquee 32s linear infinite; }
@keyframes rwdMarquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.rwd-marquee-item { display:inline-flex;align-items:center;gap:10px;padding:0 28px;font-size:.88rem;font-weight:600;color:#0e7490; }
.rwd-mi-dot { width:5px;height:5px;border-radius:50%;background:#22d3ee;flex-shrink:0; }

/* ── STATS ── */
.rwd-stats { background:linear-gradient(135deg,#042f2e 0%,#134e4a 50%,#0f766e 100%);padding:70px 0;position:relative;overflow:hidden; }
.rwd-stats-glow { position:absolute;top:-100px;right:-100px;width:600px;height:600px;background:radial-gradient(circle,rgba(14,165,233,.15),transparent 70%);pointer-events:none; }
.rwd-stats-head { text-align:center;margin-bottom:48px; }
.rwd-stats-title { font-family:var(--font-head);font-size:clamp(22px,3vw,34px);font-weight:800;color:#fff;line-height:1.2; }
.rwd-stats-title .hl-rwd { background:linear-gradient(90deg,#67e8f9,#a5f3fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.rwd-eyebrow { display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#67e8f9;background:rgba(103,232,249,.12);border:1px solid rgba(103,232,249,.25);padding:5px 14px;border-radius:100px;margin-bottom:14px; }
.rwd-eyebrow-dark { color:#0891b2;background:rgba(8,145,178,.08);border-color:rgba(8,145,178,.2); }
.rwd-stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:28px; }
.rwd-stat { background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:28px 20px;text-align:center; }
.rwd-stat-icon { width:44px;height:44px;background:rgba(14,165,233,.2);border-radius:10px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;color:#67e8f9; }
.rwd-stat-icon svg { width:22px;height:22px; }
.rwd-stat-num { font-size:2.2rem;font-weight:800;color:#fff;line-height:1;margin-bottom:6px; }
.rwd-stat-lbl { font-size:.88rem;font-weight:700;color:#a5f3fc;margin-bottom:4px; }
.rwd-stat-sub { font-size:.75rem;color:rgba(255,255,255,.45); }

/* ── SECTIONS ── */
.rwd-section { padding: 80px 0; }
.rwd-section.alt { background: #f0fdfe; }
.rwd-section-head { text-align: center; margin-bottom: 52px; }
.rwd-section-sub { color:var(--text-muted,#6b7280);font-size:.95rem;max-width:620px;margin:14px auto 0;line-height:1.6; }
.rwd-section-head h2 { font-family:var(--font-head);font-size:clamp(22px,3.2vw,36px);font-weight:800;color:var(--text-dark,#111827);line-height:1.2;margin-bottom:6px; }
.hl-rwd { color:#0891b2; }
.hl { color:#0891b2; }

/* ── KEYWORD PARA ── */
.rwd-body-para { font-size:1rem;color:var(--text,#374151);line-height:1.8;max-width:860px;margin:0 auto;text-align:center; }

/* ── FEATURED CARDS ── */
.rwd-featured-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.rwd-featured {
  background:#fff;border:1.5px solid #e5e7eb;border-radius:18px;
  padding:28px 24px;transition:.25s;
}
.rwd-featured:hover { border-color:#0891b2;box-shadow:0 8px 32px rgba(8,145,178,.1);transform:translateY(-2px); }
.rwd-featured.hot { border-color:#0891b2;box-shadow:0 4px 24px rgba(8,145,178,.12);background:linear-gradient(135deg,#f0fdfe 0%,#fff 100%); }
.ft-tag { display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.1em;color:#0e7490;background:#cffafe;padding:3px 10px;border-radius:100px;margin-bottom:14px; }
.ft-icon { font-size:2rem;margin-bottom:12px; }
.ft-title { font-size:1.05rem;font-weight:800;color:#111827;margin-bottom:8px;line-height:1.3; }
.ft-desc { font-size:.875rem;color:#6b7280;line-height:1.65;margin-bottom:14px; }
.ft-list { list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:7px; }
.ft-li { display:flex;align-items:flex-start;gap:8px;font-size:.83rem;color:#374151; }
.ft-li svg { width:14px;height:14px;color:#0891b2;flex-shrink:0;margin-top:2px; }
.ft-cta { display:inline-flex;align-items:center;gap:5px;font-size:.85rem;font-weight:700;color:#0891b2;text-decoration:none; }
.ft-cta:hover { color:#0369a1; }
.ft-cta svg { width:14px;height:14px; }

/* ── SERVICE GRID ── */
.rwd-svc-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:22px; }
.rwd-svc { background:#fff;border:1.5px solid #e5e7eb;border-radius:14px;padding:22px 20px;transition:.2s; }
.rwd-svc:hover { border-color:#0891b2;box-shadow:0 4px 20px rgba(8,145,178,.08); }
.rwd-svc-ico { font-size:1.6rem;margin-bottom:10px; }
.rwd-svc h3 { font-size:.95rem;font-weight:700;color:#111827;margin-bottom:6px; }
.rwd-svc p { font-size:.82rem;color:#6b7280;line-height:1.6;margin:0; }

/* ── PROCESS ── */
.rwd-process { display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.rwd-step-card { background:#fff;border:1.5px solid #e0f2fe;border-radius:16px;padding:28px 22px;text-align:center;position:relative; }
.rwd-step-num { font-size:.7rem;font-weight:800;letter-spacing:.12em;color:#0891b2;background:#cffafe;padding:4px 12px;border-radius:100px;display:inline-block;margin-bottom:14px; }
.rwd-step-card h4 { font-size:.98rem;font-weight:800;color:#111827;margin-bottom:8px; }
.rwd-step-card p { font-size:.82rem;color:#6b7280;line-height:1.6;margin:0; }

/* ── COMPARE TABLE ── */
.rwd-cmp { border:1.5px solid #e5e7eb;border-radius:16px;overflow:hidden; }
.rwd-cmp-head { display:grid;grid-template-columns:1fr 1fr 1fr;background:#f9fafb; }
.rwd-cmp-label { padding:22px 20px;font-size:.78rem;font-weight:700;color:#6b7280;letter-spacing:.06em;text-transform:uppercase; }
.rwd-cmp-col-a,.rwd-cmp-col-b { padding:22px 20px;border-left:1px solid #e5e7eb; }
.rwd-cmp-tag { display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.08em;background:#f3f4f6;color:#374151;padding:3px 10px;border-radius:100px;margin-bottom:8px; }
.rwd-cmp-tag-rec { background:#cffafe;color:#0e7490; }
.rwd-cmp-col-a h3,.rwd-cmp-col-b h3 { font-size:1.1rem;font-weight:800;color:#111827;margin-bottom:6px; }
.rwd-cmp-desc { font-size:.8rem;color:#6b7280;line-height:1.5;margin-bottom:8px; }
.rwd-cmp-price { font-size:1.3rem;font-weight:800;color:#0891b2; }
.rwd-cmp-row { display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid #f3f4f6; }
.rwd-cmp-key { padding:14px 20px;font-size:.83rem;font-weight:600;color:#374151; }
.rwd-cmp-val { padding:14px 20px;font-size:.83rem;color:#374151;border-left:1px solid #f3f4f6; }
.rwd-cmp-yes { color:#0891b2;font-weight:600; }
.rwd-cmp-meh { color:#9ca3af; }
.rwd-cmp-cta-row { display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid #e5e7eb;background:#f9fafb; }
.rwd-cmp-cta-empty { padding:20px; }
.rwd-cmp-cta-cell { padding:20px;border-left:1px solid #e5e7eb;display:flex;align-items:center;justify-content:center; }
.rwd-cmp-btn { display:inline-flex;align-items:center;justify-content:center;padding:11px 22px;border-radius:10px;font-size:.88rem;font-weight:700;text-decoration:none;transition:.2s; }
.rwd-cmp-btn-a { background:#f3f4f6;color:#374151;border:1.5px solid #e5e7eb; }
.rwd-cmp-btn-a:hover { background:#e5e7eb; }
.rwd-cmp-btn-b { background:#0891b2;color:#fff; }
.rwd-cmp-btn-b:hover { background:#0369a1;color:#fff; }

/* ── WHY US ── */
.rwd-why-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.rwd-why-card { background:#fff;border:1.5px solid #e5e7eb;border-radius:16px;padding:28px 22px; }
.rwd-why-ico { font-size:1.8rem;margin-bottom:12px; }
.rwd-why-card h3 { font-size:1rem;font-weight:800;color:#111827;margin-bottom:8px; }
.rwd-why-card p { font-size:.84rem;color:#6b7280;line-height:1.65;margin:0; }

/* ── TESTIMONIALS ── */
.rwd-testi-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.rwd-testi { background:#fff;border:1.5px solid #e5e7eb;border-radius:16px;padding:28px 24px; }
.rwd-testi-stars { color:#f59e0b;font-size:1rem;margin-bottom:12px;letter-spacing:2px; }
.rwd-testi-quote { font-size:.88rem;color:#374151;line-height:1.7;margin-bottom:18px;font-style:italic; }
.rwd-testi-meta { display:flex;align-items:center;gap:12px; }
.rwd-testi-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#0891b2,#22d3ee);color:#fff;font-size:.85rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.rwd-testi-name { font-size:.88rem;font-weight:700;color:#111827; }
.rwd-testi-role { font-size:.75rem;color:#9ca3af; }

/* ── FAQ ── */
.rwd-faq { max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:10px; }
.rwd-faq .faq-item { background:#fff;border:1.5px solid #e5e7eb;border-radius:12px;overflow:hidden; }
.rwd-faq .faq-item summary { cursor:pointer;padding:18px 22px;font-size:.95rem;font-weight:700;color:#111827;list-style:none;display:flex;align-items:center;justify-content:space-between; }
.rwd-faq .faq-item summary::-webkit-details-marker { display:none; }
.rwd-faq .faq-item[open] summary { color:#0891b2; }
.rwd-faq .faq-body { padding:0 22px 18px;font-size:.88rem;color:#6b7280;line-height:1.75; }

/* ── FINAL CTA ── */
.rwd-cta-final { background:linear-gradient(135deg,#042f2e 0%,#0f766e 50%,#0891b2 100%);padding:72px 0;text-align:center;color:#fff; }
.rwd-cta-final h2 { font-family:var(--font-head);font-size:clamp(24px,3.5vw,40px);font-weight:800;margin-bottom:16px; }
.rwd-cta-final h2 .hl-rwd { background:linear-gradient(90deg,#67e8f9,#a5f3fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.rwd-cta-final p { font-size:1rem;color:rgba(255,255,255,.75);margin-bottom:32px;max-width:560px;margin-left:auto;margin-right:auto; }

/* ── STICKY ── */
.rwd-sticky { display:none;position:fixed;bottom:0;left:0;right:0;z-index:9000;background:linear-gradient(90deg,#042f2e,#0891b2);padding:12px 20px;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 -4px 24px rgba(0,0,0,.18); }
.rwd-sticky.show { display:flex; }
.rwd-sticky-text { color:#fff;font-size:.88rem;font-weight:700;line-height:1.3; }
.rwd-sticky-text small { display:block;font-weight:400;font-size:.75rem;color:rgba(255,255,255,.65);margin-top:2px; }
.rwd-sticky-btn { display:inline-flex;align-items:center;gap:7px;background:#25D366;color:#fff;padding:10px 20px;border-radius:8px;font-size:.88rem;font-weight:800;text-decoration:none;flex-shrink:0;white-space:nowrap; }
.rwd-sticky-btn svg { width:16px;height:16px; }

/* ── REVEAL ── */
.reveal { opacity:0;transform:translateY(22px);transition:opacity .55s ease,transform .55s ease; }
.reveal.visible { opacity:1;transform:none; }
.reveal-delay-1 { transition-delay:.12s; }
.reveal-delay-2 { transition-delay:.24s; }
.reveal-delay-3 { transition-delay:.36s; }

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .rwd-hero-grid,.rwd-featured-grid,.rwd-stats-grid,.rwd-process { grid-template-columns:1fr 1fr; }
  .rwd-svc-grid,.rwd-why-grid,.rwd-testi-grid { grid-template-columns:1fr 1fr; }
  .rwd-cmp-head,.rwd-cmp-row,.rwd-cmp-cta-row { grid-template-columns:1fr 1fr; }
  .rwd-cmp-label { display:none; }
  .rwd-cmp-col-a { border-left:none; }
}
@media(max-width:600px){
  .rwd-hero { padding:100px 0 60px; }
  .rwd-hero-grid,.rwd-featured-grid,.rwd-stats-grid,.rwd-process { grid-template-columns:1fr; }
  .rwd-svc-grid,.rwd-why-grid,.rwd-testi-grid { grid-template-columns:1fr; }
  .rwd-cmp-head,.rwd-cmp-row,.rwd-cmp-cta-row { grid-template-columns:1fr; }
  .rwd-cmp-col-b,.rwd-cmp-val:first-of-type { display:none; }
  .rwd-cmp-cta-row { display:none; }
  .rwd-cta-row { flex-direction:column; }
}
