/* Web Application Development page (tpl/web-application.php). Loaded only on that template. */
.wad-hero #breadcrumbs a { color: #c6dc4a; }
.wad-eyebrow { background: rgba(168, 194, 16, .14); border: 1px solid rgba(168, 194, 16, .4); border-radius: 50rem; color: #d6e86a; display: inline-block; font-size: .8rem; font-weight: 600; letter-spacing: .04em; padding: .3rem .9rem; }
.wad-hero h1 { font-size: clamp(1.9rem, 3.2vw, 2.9rem); line-height: 1.15; }
.wad-point { color: #dfe7f5; font-size: .9rem; white-space: nowrap; }
.wad-point > span { color: #a8c210; }
.wad-hero-img { max-width: 600px; width: 100%; }
@media (prefers-reduced-motion: no-preference) {
  .wad-hero-img { animation: wad-float 7s ease-in-out infinite; }
  @keyframes wad-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
}
.wad-card { background: #fff; border: 1px solid rgba(0, 0, 0, .08); border-radius: 1rem; height: 100%; padding: 1.5rem; }
.wad-icon { align-items: center; background: rgba(168, 194, 16, .15); border-radius: 50%; color: #5d6c00; display: inline-flex; font-size: 1.25rem; height: 48px; justify-content: center; margin-bottom: 1rem; width: 48px; }
.wad-plan .features-list dt { background: rgba(0, 0, 0, .04); border-radius: .375rem; font-weight: 600; }
.wad-plan .features-list dd { margin-bottom: .35rem; padding-left: .5rem; }
.wad-plan-badge, .plan-laravel-badge { border-bottom-left-radius: 6px; color: #fff; font-size: .72rem; font-weight: 600; letter-spacing: .05em; padding: 4px 12px; position: absolute; right: -1px; text-transform: uppercase; top: -1px; }
.wad-plan-badge { background-color: #5d6c00; }
.plan-laravel-badge { background-color: #e07b39; }
.plan-laravel { background: linear-gradient(135deg, #fff8f0 0%, #ffffff 100%); border-color: #e07b39 !important; }
.wad-step-num { align-items: center; background: #a8c210; border-radius: 50%; color: #111; display: inline-flex; flex: 0 0 40px; font-weight: 700; height: 40px; justify-content: center; width: 40px; }
.wad-note { background-color: #fff3e0; border-left: 3px solid #e07b39; color: #7a4a1e; font-size: .9rem; }