feat: add pure-CSS & SVG podcast and webinar section (zero images) with bilingual i18n
This commit is contained in:
@@ -359,4 +359,41 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// ==========================================================================
|
||||
// 7. PODCAST SAMPLE AUDIO CONTROLS (Zero Image / Pure SVG)
|
||||
// ==========================================================================
|
||||
const playBtn = document.getElementById('podcast-play-sample');
|
||||
if (playBtn) {
|
||||
let isPlaying = false;
|
||||
let playInterval = null;
|
||||
let currentSeconds = 0;
|
||||
const playerTrackFill = document.querySelector('.player-fill');
|
||||
const playerTime = document.querySelector('.player-time');
|
||||
|
||||
playBtn.addEventListener('click', () => {
|
||||
isPlaying = !isPlaying;
|
||||
if (isPlaying) {
|
||||
playBtn.innerHTML = '<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="4" width="4" height="16"></rect><rect x="14" y="4" width="4" height="16"></rect></svg>';
|
||||
playBtn.setAttribute('aria-label', 'Pause sample episode audio');
|
||||
|
||||
playInterval = setInterval(() => {
|
||||
currentSeconds += 1;
|
||||
if (currentSeconds > 1458) currentSeconds = 0;
|
||||
const mins = Math.floor(currentSeconds / 60);
|
||||
const secs = (currentSeconds % 60).toString().padStart(2, '0');
|
||||
if (playerTime) playerTime.textContent = `${mins}:${secs} / 24:18`;
|
||||
if (playerTrackFill) {
|
||||
const pct = Math.min(100, Math.max(0, (currentSeconds / 1458) * 100));
|
||||
playerTrackFill.style.width = `${pct}%`;
|
||||
}
|
||||
}, 1000);
|
||||
} else {
|
||||
clearInterval(playInterval);
|
||||
playBtn.innerHTML = '<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>';
|
||||
playBtn.setAttribute('aria-label', 'Play sample episode audio');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
+143
@@ -107,6 +107,7 @@
|
||||
<a href="#transformation" class="nav-link" data-i18n="nav.transformation">Before & After</a>
|
||||
<a href="#projects" class="nav-link" data-i18n="nav.projects">Projects</a>
|
||||
<a href="#areas" class="nav-link" data-i18n="nav.areas">Service Areas</a>
|
||||
<a href="#podcast-webinar" class="nav-link" data-i18n="nav.media">Podcast & Webinar</a>
|
||||
<a href="#reviews" class="nav-link" data-i18n="nav.reviews">Reviews</a>
|
||||
<a href="contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
|
||||
</nav>
|
||||
@@ -137,6 +138,7 @@
|
||||
<a href="#transformation" class="nav-link mobile-link">Before & After</a>
|
||||
<a href="#projects" class="nav-link mobile-link">Projects</a>
|
||||
<a href="#areas" class="nav-link mobile-link">Service Areas</a>
|
||||
<a href="#podcast-webinar" class="nav-link mobile-link" data-i18n="nav.media">Podcast & Webinar</a>
|
||||
<a href="#reviews" class="nav-link mobile-link">Customer Reviews</a>
|
||||
<a href="contact.html" class="nav-link mobile-link">Contact Us</a>
|
||||
<div class="mobile-lang-wrap">
|
||||
@@ -960,6 +962,147 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 8.5 PODCAST & WEBINAR MEDIA SECTION (100% Vector & Pure CSS - No Images) -->
|
||||
<section class="section media-hub-section" id="podcast-webinar">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-tag">
|
||||
<span class="badge">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="margin-right: 6px;"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"></path><path d="M19 10v2a7 7 0 0 1-14 0v-2"></path><line x1="12" y1="19" x2="12" y2="23"></line><line x1="8" y1="23" x2="16" y2="23"></line></svg>
|
||||
High Desert Educational Hub
|
||||
</span>
|
||||
</div>
|
||||
<h2 class="section-title" data-i18n-html="media.title">The High Desert Yard <span class="neon-text">Podcast & Webinars</span></h2>
|
||||
<p class="section-description" data-i18n="media.desc">
|
||||
Get expert yard maintenance tactics, LA County fire code compliance secrets, and desert xeriscaping strategies directly from our crew. Tune in or register for our next free live masterclass.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="media-grid">
|
||||
<!-- CARD 1: THE PODCAST -->
|
||||
<div class="media-card podcast-card">
|
||||
<div class="media-card-top">
|
||||
<div class="media-badge-group">
|
||||
<span class="media-badge podcast-badge">
|
||||
<svg width="12" height="12" viewBox="0 0 24 24" fill="currentColor" style="margin-right: 4px;"><circle cx="12" cy="12" r="10"></circle><polygon points="10 8 16 12 10 16 10 8" fill="#080c09"></polygon></svg>
|
||||
Weekly Podcast Series
|
||||
</span>
|
||||
<span class="media-badge-sub">New Episodes Every Tuesday</span>
|
||||
</div>
|
||||
|
||||
<!-- Pure CSS Animated Soundwave Visualizer (Zero Image Files) -->
|
||||
<div class="soundwave-container" aria-hidden="true" title="Audio Stream Active">
|
||||
<span class="soundwave-bar bar-1"></span>
|
||||
<span class="soundwave-bar bar-2"></span>
|
||||
<span class="soundwave-bar bar-3"></span>
|
||||
<span class="soundwave-bar bar-4"></span>
|
||||
<span class="soundwave-bar bar-5"></span>
|
||||
<span class="soundwave-bar bar-6"></span>
|
||||
<span class="soundwave-bar bar-7"></span>
|
||||
<span class="soundwave-bar bar-8"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="media-card-content">
|
||||
<h3 class="media-title">High Desert Yard Talk</h3>
|
||||
<p class="media-desc">
|
||||
Hosted by the Next Gen crew. We break down the real science of desert yard survival: dealing with 60 MPH Palmdale windstorms, preventing tumbleweed blow-ins, and avoiding $5,000 county weed abatement fines.
|
||||
</p>
|
||||
|
||||
<!-- Featured Episode Player Box -->
|
||||
<div class="episode-box">
|
||||
<div class="episode-header">
|
||||
<span class="episode-tag">LATEST EPISODE #14</span>
|
||||
<span class="episode-length">24 Min Listen</span>
|
||||
</div>
|
||||
<h4 class="episode-name">"Beating the June 1st Fire Clearance Deadline in Palmdale & Lancaster"</h4>
|
||||
|
||||
<div class="mini-player-bar">
|
||||
<button type="button" class="player-toggle-btn" aria-label="Play sample episode audio" id="podcast-play-sample">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>
|
||||
</button>
|
||||
<div class="player-track">
|
||||
<div class="player-fill"></div>
|
||||
</div>
|
||||
<span class="player-time">0:00 / 24:18</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Stream Platforms (Clean SVGs) -->
|
||||
<div class="platform-strip">
|
||||
<span class="platform-label">Stream Free On:</span>
|
||||
<div class="platform-icons">
|
||||
<a href="#podcast-webinar" class="platform-chip" title="Spotify">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0zm5.503 17.31c-.218.358-.684.472-1.042.254-2.857-1.745-6.453-2.14-10.688-1.172-.41.094-.821-.16-.915-.57-.094-.41.16-.821.57-.915 4.634-1.06 8.608-.616 11.821 1.345.358.218.472.684.254 1.058zm1.469-3.267c-.275.447-.86.59-1.307.315-3.27-2.01-8.254-2.593-12.122-1.417-.5.152-1.034-.132-1.186-.632-.152-.5.132-1.034.632-1.186 4.417-1.34 9.907-.685 13.668 1.633.447.275.59.86.315 1.307zm.126-3.41c-3.923-2.33-10.384-2.545-14.133-1.406-.603.183-1.246-.16-1.429-.763-.183-.603.16-1.246.763-1.429 4.312-1.308 11.439-1.058 15.94 1.615.542.321.72 1.025.399 1.567-.321.542-1.025.72-1.54.416z"/></svg>
|
||||
Spotify
|
||||
</a>
|
||||
<a href="#podcast-webinar" class="platform-chip" title="Apple Podcasts">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor"><path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M15.97 6.41c.64-.78 1.08-1.86.96-2.94-.93.04-2.06.62-2.72 1.4-.58.67-1.09 1.77-.95 2.83 1.04.08 2.07-.51 2.71-1.29z"/></svg>
|
||||
Apple
|
||||
</a>
|
||||
<a href="#podcast-webinar" class="platform-chip" title="YouTube">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
|
||||
YouTube
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- CARD 2: THE LIVE WEBINAR -->
|
||||
<div class="media-card webinar-card">
|
||||
<div class="media-card-top">
|
||||
<div class="media-badge-group">
|
||||
<span class="media-badge webinar-badge">
|
||||
<span class="pulse-live-dot"></span>
|
||||
Free Interactive Webinar
|
||||
</span>
|
||||
<span class="media-badge-sub">Live Q&A Session</span>
|
||||
</div>
|
||||
|
||||
<!-- Clean Calendar Vector Graphic (No images) -->
|
||||
<div class="webinar-icon-wrap" aria-hidden="true">
|
||||
<svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line><polygon points="12 14 15 17 12 20 12 14" fill="currentColor"></polygon></svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="media-card-content">
|
||||
<h3 class="media-title">Antelope Valley Fire-Safe Yard Masterclass</h3>
|
||||
<p class="media-desc">
|
||||
Learn step-by-step how to prepare your property for official county inspections and cut annual maintenance time by 80% without destroying your budget.
|
||||
</p>
|
||||
|
||||
<!-- Session Schedule & Highlights -->
|
||||
<div class="webinar-schedule-box">
|
||||
<div class="webinar-date-row">
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--neon-green)" stroke-width="2.5"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>
|
||||
<div>
|
||||
<strong>Next Live Broadcast:</strong>
|
||||
<span>Thursday, October 15, 2026 • 6:30 PM PST</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="webinar-bullets">
|
||||
<li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--neon-green)" stroke-width="3"><polyline points="20 6 9 17 4 12"></polyline></svg> LA County 100-Ft Brush Clearance rules decoded</li>
|
||||
<li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--neon-green)" stroke-width="3"><polyline points="20 6 9 17 4 12"></polyline></svg> Desert Xeriscaping vs. Artificial Turf cost breakdown</li>
|
||||
<li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--neon-green)" stroke-width="3"><polyline points="20 6 9 17 4 12"></polyline></svg> Live open Q&A directly with Jose & senior crew</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Registration CTA -->
|
||||
<div class="webinar-action-row">
|
||||
<a href="#lead-form-modal" class="btn btn-primary open-quote-btn" style="width: 100%; justify-content: center;">
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7.5" r="4"></circle><line x1="20" y1="8" x2="20" y2="14"></line><line x1="23" y1="11" x2="17" y2="11"></line></svg>
|
||||
Reserve Free Webinar Seat
|
||||
</a>
|
||||
<span class="webinar-guarantee">100% Free • Includes PDF Fire Clearance Checklist</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 9. CUSTOMER REVIEWS -->
|
||||
<section class="section" id="reviews">
|
||||
<div class="container">
|
||||
|
||||
+360
@@ -2676,3 +2676,363 @@ section#projects {
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
PODCAST & WEBINAR MEDIA SECTION (100% Vector & Pure CSS - No Images)
|
||||
========================================================================== */
|
||||
.media-hub-section {
|
||||
background: var(--bg-subtle);
|
||||
position: relative;
|
||||
padding: 90px 0;
|
||||
}
|
||||
|
||||
.media-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 30px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.media-card {
|
||||
background: var(--bg-card);
|
||||
border-radius: 16px;
|
||||
border: 1.5px solid var(--border-card);
|
||||
padding: 36px;
|
||||
box-shadow: var(--shadow-card);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
transition: transform var(--transition-smooth), border-color var(--transition-smooth), box-shadow var(--transition-smooth);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.media-card:hover {
|
||||
transform: translateY(-4px);
|
||||
border-color: var(--neon-green);
|
||||
box-shadow: 0 16px 36px rgba(0, 200, 83, 0.12);
|
||||
}
|
||||
|
||||
.media-card-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
|
||||
.media-badge-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.media-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
padding: 5px 12px;
|
||||
border-radius: 50px;
|
||||
}
|
||||
|
||||
.podcast-badge {
|
||||
background: rgba(0, 200, 83, 0.12);
|
||||
color: var(--neon-text-shade);
|
||||
border: 1px solid rgba(0, 200, 83, 0.3);
|
||||
}
|
||||
|
||||
.webinar-badge {
|
||||
background: rgba(239, 68, 68, 0.1);
|
||||
color: #dc2626;
|
||||
border: 1px solid rgba(239, 68, 68, 0.25);
|
||||
}
|
||||
|
||||
.pulse-live-dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: #ef4444;
|
||||
margin-right: 6px;
|
||||
display: inline-block;
|
||||
box-shadow: 0 0 0 rgba(239, 68, 68, 0.7);
|
||||
animation: pulse-dot 1.8s infinite;
|
||||
}
|
||||
|
||||
@keyframes pulse-dot {
|
||||
0% {
|
||||
transform: scale(0.95);
|
||||
box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7);
|
||||
}
|
||||
70% {
|
||||
transform: scale(1.1);
|
||||
box-shadow: 0 0 0 8px rgba(239, 68, 68, 0);
|
||||
}
|
||||
100% {
|
||||
transform: scale(0.95);
|
||||
box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.media-badge-sub {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-muted);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Pure CSS Soundwave Animation */
|
||||
.soundwave-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 3px;
|
||||
height: 28px;
|
||||
padding: 4px 8px;
|
||||
background: #080c09;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(0, 200, 83, 0.25);
|
||||
}
|
||||
|
||||
.soundwave-bar {
|
||||
width: 3px;
|
||||
background: var(--neon-lime);
|
||||
border-radius: 3px;
|
||||
animation: bounce-soundwave 1.2s infinite ease-in-out alternate;
|
||||
}
|
||||
|
||||
.bar-1 { height: 8px; animation-delay: 0.1s; }
|
||||
.bar-2 { height: 18px; animation-delay: 0.3s; }
|
||||
.bar-3 { height: 12px; animation-delay: 0.2s; }
|
||||
.bar-4 { height: 22px; animation-delay: 0.4s; }
|
||||
.bar-5 { height: 14px; animation-delay: 0.25s; }
|
||||
.bar-6 { height: 20px; animation-delay: 0.35s; }
|
||||
.bar-7 { height: 10px; animation-delay: 0.15s; }
|
||||
.bar-8 { height: 16px; animation-delay: 0.45s; }
|
||||
|
||||
@keyframes bounce-soundwave {
|
||||
0% { transform: scaleY(0.4); }
|
||||
100% { transform: scaleY(1.2); }
|
||||
}
|
||||
|
||||
.webinar-icon-wrap {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 10px;
|
||||
background: rgba(0, 200, 83, 0.1);
|
||||
color: var(--neon-text-shade);
|
||||
border: 1px solid rgba(0, 200, 83, 0.2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.media-title {
|
||||
font-size: 1.45rem;
|
||||
font-weight: 800;
|
||||
color: var(--text-primary);
|
||||
margin-bottom: 10px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.media-desc {
|
||||
font-size: 0.95rem;
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.6;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* Episode Player Box */
|
||||
.episode-box {
|
||||
background: #080c09;
|
||||
border-radius: 12px;
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid rgba(0, 200, 83, 0.25);
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.episode-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.episode-tag {
|
||||
font-size: 0.72rem;
|
||||
font-weight: 800;
|
||||
color: var(--neon-lime);
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.episode-length {
|
||||
font-size: 0.72rem;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.episode-name {
|
||||
font-size: 0.96rem;
|
||||
color: #ffffff;
|
||||
font-weight: 700;
|
||||
margin-bottom: 14px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.mini-player-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.player-toggle-btn {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 50%;
|
||||
background: var(--neon-green);
|
||||
color: #080c09;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
transition: transform 0.15s ease, background 0.15s ease;
|
||||
}
|
||||
|
||||
.player-toggle-btn:hover {
|
||||
background: var(--neon-lime);
|
||||
transform: scale(1.08);
|
||||
}
|
||||
|
||||
.player-track {
|
||||
flex: 1;
|
||||
height: 6px;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.player-fill {
|
||||
width: 35%;
|
||||
height: 100%;
|
||||
background: var(--neon-lime);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.player-time {
|
||||
font-size: 0.75rem;
|
||||
color: #94a3b8;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
/* Platform Strip */
|
||||
.platform-strip {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
padding-top: 14px;
|
||||
border-top: 1px solid var(--border-subtle);
|
||||
}
|
||||
|
||||
.platform-label {
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.platform-icons {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.platform-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
padding: 6px 12px;
|
||||
border-radius: 20px;
|
||||
background: var(--bg-surface);
|
||||
border: 1px solid var(--border-subtle);
|
||||
color: var(--text-primary);
|
||||
font-size: 0.76rem;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.platform-chip:hover {
|
||||
background: var(--bg-card-hover);
|
||||
border-color: var(--neon-green);
|
||||
color: var(--neon-text-shade);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* Webinar Schedule Box */
|
||||
.webinar-schedule-box {
|
||||
background: var(--bg-surface);
|
||||
border: 1px solid var(--border-subtle);
|
||||
border-radius: 12px;
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.webinar-date-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
margin-bottom: 14px;
|
||||
padding-bottom: 12px;
|
||||
border-bottom: 1px solid var(--border-subtle);
|
||||
}
|
||||
|
||||
.webinar-date-row strong {
|
||||
display: block;
|
||||
font-size: 0.88rem;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.webinar-date-row span {
|
||||
display: block;
|
||||
font-size: 0.84rem;
|
||||
color: var(--neon-text-shade);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.webinar-bullets {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.webinar-bullets li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 0.85rem;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.webinar-action-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.webinar-guarantee {
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-muted);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.media-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -41,6 +41,10 @@
|
||||
en: 'Ready To Reclaim Your <span class="neon-text">High Desert Yard?</span>',
|
||||
es: '¿Listo Para Recuperar Su <span class="neon-text">Jardín del Alto Desierto?</span>'
|
||||
},
|
||||
"media.title": {
|
||||
en: 'The High Desert Yard <span class="neon-text">Podcast & Webinars</span>',
|
||||
es: 'El Podcast y Seminarios Web de <span class="neon-text">Jardinería del Alto Desierto</span>'
|
||||
},
|
||||
"modal.title": {
|
||||
en: 'Request Your <span class="neon-text">Free Estimate</span>',
|
||||
es: 'Solicite Su <span class="neon-text">Presupuesto Gratis</span>'
|
||||
@@ -57,6 +61,30 @@
|
||||
"Direct: (661) 743-9600": "Directo: (661) 743-9600",
|
||||
"24-Hr Text Dispatch Available": "Despacho por Mensaje 24 Horas",
|
||||
|
||||
// --- Media / Podcast & Webinar ---
|
||||
"High Desert Educational Hub": "Centro Educativo del Alto Desierto",
|
||||
"Weekly Podcast Series": "Serie Semanal de Podcast",
|
||||
"New Episodes Every Tuesday": "Nuevos Episodios Cada Martes",
|
||||
"High Desert Yard Talk": "Charla de Jardinería del Alto Desierto",
|
||||
"Free Interactive Webinar": "Seminario Web Interactivo Gratuito",
|
||||
"Live Q&A Session": "Sesión de Preguntas y Respuestas en Vivo",
|
||||
"Antelope Valley Fire-Safe Yard Masterclass": "Clase Magistral de Jardines Seguros Contra Incendios en Antelope Valley",
|
||||
"Reserve Free Webinar Seat": "Reservar Lugar Gratis en el Seminario Web",
|
||||
"Podcast & Webinar": "Podcast y Seminario Web",
|
||||
"Get expert yard maintenance tactics, LA County fire code compliance secrets, and desert xeriscaping strategies directly from our crew. Tune in or register for our next free live masterclass.": "Obtenga tácticas de mantenimiento de jardines, secretos de cumplimiento contra incendios del Condado de LA y estrategias de paisajismo desértico. Sintonice o regístrese gratis.",
|
||||
"Hosted by the Next Gen crew. We break down the real science of desert yard survival: dealing with 60 MPH Palmdale windstorms, preventing tumbleweed blow-ins, and avoiding $5,000 county weed abatement fines.": "Presentado por el equipo de Next Gen. Explicamos la supervivencia del jardín desértico: tormentas de viento de 60 MPH en Palmdale, prevención de rodadoras y cómo evitar multas del condado de $5,000.",
|
||||
"LATEST EPISODE #14": "ÚLTIMO EPISODIO #14",
|
||||
"24 Min Listen": "Escucha de 24 Min",
|
||||
"\"Beating the June 1st Fire Clearance Deadline in Palmdale & Lancaster\"": "\"Superando el Plazo del 1 de Junio para el Desbroce contra Incendios en Palmdale y Lancaster\"",
|
||||
"Stream Free On:": "Transmita Gratis en:",
|
||||
"Learn step-by-step how to prepare your property for official county inspections and cut annual maintenance time by 80% without destroying your budget.": "Aprenda paso a paso cómo preparar su propiedad para las inspecciones oficiales del condado y reducir el tiempo de mantenimiento anual en un 80% sin exceder su presupuesto.",
|
||||
"Next Live Broadcast:": "Próxima Transmisión en Vivo:",
|
||||
"Thursday, October 15, 2026 • 6:30 PM PST": "Jueves, 15 de Octubre, 2026 • 6:30 PM PST",
|
||||
"LA County 100-Ft Brush Clearance rules decoded": "Reglas de desbroce de 100 pies del condado de LA explicadas",
|
||||
"Desert Xeriscaping vs. Artificial Turf cost breakdown": "Comparativa de costos: Paisajismo desértico vs. Césped artificial",
|
||||
"Live open Q&A directly with Jose & senior crew": "Preguntas y respuestas en vivo directamente con José y el equipo",
|
||||
"100% Free • Includes PDF Fire Clearance Checklist": "100% Gratis • Incluye Lista de Verificación en PDF",
|
||||
|
||||
// --- Navigation Links ---
|
||||
"Services": "Servicios",
|
||||
"Cost Calculator": "Calculadora de Costos",
|
||||
|
||||
Reference in New Issue
Block a user