diff options
| -rw-r--r-- | index.html | 95 | ||||
| -rw-r--r-- | style.css | 438 |
2 files changed, 365 insertions, 168 deletions
@@ -73,37 +73,82 @@ in favor of open standards and crypto agility. </p> - <!-- NEW PRODUCT PLACEMENT SECTION --> + <!-- PRODUCT SHOWCASE SECTION --> <div class="product-showcase"> <div class="product-image"> - <img src="image.jpg" alt="ARFHL-UM Dual-Band Wi-Fi HaLow MESH Portable Gateway"> - <caption>ARFHL-UM Portable Gateway</caption> + <img src="image.jpg" alt="ARFHL Tactical Wi-Fi HaLow MESH Network"> + <caption>ARFHL Tactical Network Node</caption> </div> <div class="product-features"> - <h3>ARFHL-UM Dual-Band Wi-Fi HaLow MESH Portable Gateway</h3> - <ul> - <li> - <strong>Plug-and-Play, Zero Configuration:</strong> No setup required, offering immediate access to wireless internet. - </li> - <li> - <strong>Energy Efficiency:</strong> Wi-Fi HaLow ensures low power consumption, long-range connectivity, excellent signal penetration, and energy efficiency, all while reducing costs and environmental impact. - </li> - <li> - <strong>USB Power Bank Support:</strong> A wearable, convenient solution. A standard power bank can keep the ARFHL-UM operational for up to 8 hours. - </li> - <li> - <strong>Seamless On-the-Go Connectivity:</strong> Lightweight, convenient wearable devices, combined with WiFi HaLow's long-range connectivity, provide wireless networking anytime, anywhere. - </li> - <li> - <strong>Long-Range Solution:</strong> Offers connectivity over distances exceeding 1 km, surpassing the limitations of traditional Wi-Fi protocols. - </li> - <li> - <strong>Single solution for multiple operational scenarios:</strong> Solution provides flexibility. The radio can be carried by a single person, vehicle mounted or shared between group or operations center. The usage remains the same, the antenna changes. - </li> - </ul> + <h3>ARFHL Tactical Wi-Fi HaLow MESH Network</h3> + <p class="product-subtitle"> + Combining portable gateway mobility with robust access point capabilities + </p> + + <div class="feature-grid"> + <div class="feature-category"> + <h4>Portable Gateway Features (ARFHL-UM)</h4> + <ul> + <li> + <strong>Plug-and-Play, Zero Configuration:</strong>No setup required, offering + immediate access to wireless internet. + </li> + <li> + <strong>Energy Efficiency:</strong>Wi-Fi HaLow ensures low power consumption, + excellent signal penetration, and energy efficiency, all while reducing costs + and environmental impact. + </li> + <li> + <strong>USB Power Bank Support:</strong>A wearable, convenient solution. A + standard power bank can keep the ARFHL operational for up to 8 hours. + </li> + <li> + <strong>Seamless On-the-Go Connectivity:</strong>Lightweight, convenient + wearable devices, combined with WiFi HaLow's long-range connectivity, provide + wireless networking anytime, anywhere. + </li> + </ul> + </div> + + <div class="feature-category"> + <h4>Access Point Features (ARFHL-AP)</h4> + <ul> + <li> + <strong>Versatile Connectivity:</strong>Offers diverse connectivity options, + eliminating the need for unnecessary hubs. Customize and expand your wireless + network with unparalleled flexibility. + </li> + <li> + <strong>High Device Capacity:</strong>Supports over 8,000 stable connections, + four times the capacity of traditional Wi-Fi access points, thanks to + innovative star network topology. + </li> + <li> + <strong>Long-Range Communication:</strong>Pushes Wi-Fi boundaries, extending + connectivity farther than ever before, exceeding 1 km per hop. + </li> + <li> + <strong>Robust Data Transmission:</strong>Achieves reliable 150Kbps data rates + for distances over 1 kilometer, coupled with high-speed video streaming + capabilities for shorter ranges. + </li> + <li> + <strong>Exceptional Signal Penetration:</strong>Excels in cutting through + barriers, providing tenfold improved signal penetration compared to standard + Wi-Fi frequencies, ensuring strong and consistent connectivity. + </li> + </ul> + </div> + </div> + + <div class="product-highlight"> + <strong>Unified Solution:</strong>ARFHL integrates both portable gateway and access + point capabilities into a single, cohesive system designed for tactical edge + communications. + </div> </div> </div> - <!-- END NEW SECTION --> + <!-- END PRODUCT SHOWCASE --> <div class="advantages"> <div class="advantage-card"> @@ -1,196 +1,348 @@ +/* style.css - ARFHL Tactical Wi-Fi HaLow Mesh Network */ + +/* ===== BASE STYLES ===== */ body { - font-family: Arial, Helvetica, sans-serif; - margin: 0; - background-color: #0f1419; - color: #e6e6e6; - line-height: 1.6; + font-family: Arial, Helvetica, sans-serif; + margin: 0; + background-color: #0f1419; + color: #e6e6e6; + line-height: 1.6; } + +/* ===== HEADER & NAVIGATION ===== */ header { - background: linear-gradient(135deg, #1b2633, #0f1419); - padding: 40px; + background: linear-gradient(135deg, #1b2633, #0f1419); + padding: 40px; } + header h1 { - margin: 0; - font-size: 2.4em; + margin: 0; + font-size: 2.4em; } + header p { - max-width: 900px; - color: #cfd8dc; + max-width: 900px; + color: #cfd8dc; } + .gap-box { - background-color: #1a222b; - border: 1px solid #2e3b4a; - border-left: 4px solid #ff6b6b; - padding: 20px; - margin: 20px 0; - max-width: 900px; + background-color: #1a222b; + border: 1px solid #2e3b4a; + border-left: 4px solid #ff6b6b; + padding: 20px; + margin: 20px 0; + max-width: 900px; +} + +/* ===== BADGES ===== */ +.badge { + display: inline-block; + background-color: #263238; + padding: 4px 10px; + margin: 4px 0; + border-radius: 4px; + font-size: 0.85em; +} + +.procurement-badge { + background-color: #1a5276; + color: #fff; + margin-right: 8px; } + +/* ===== MAIN CONTENT ===== */ section { - padding: 40px; - max-width: 1200px; - margin: auto; + padding: 40px; + max-width: 1200px; + margin: auto; } + h2 { - border-bottom: 2px solid #2e3b4a; - padding-bottom: 8px; + border-bottom: 2px solid #2e3b4a; + padding-bottom: 8px; } + h3 { - color: #90caf9; + color: #90caf9; } -table { - width: 100%; - border-collapse: collapse; - margin-top: 20px; + +/* ===== PRODUCT SHOWCASE ===== */ +.product-showcase { + display: grid; + grid-template-columns: 1fr 2fr; + gap: 30px; + margin: 40px 0; + padding: 25px; + background-color: #1a222b; + border: 1px solid #2e3b4a; + border-radius: 8px; + align-items: start; } -th, -td { - border: 1px solid #2e3b4a; - padding: 10px; - text-align: left; - vertical-align: top; + +.product-image { + text-align: center; } -th { - background-color: #1b2633; + +.product-image img { + width: 100%; + max-width: 300px; + height: auto; + border-radius: 6px; + border: 1px solid #2e3b4a; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } -ul { - margin-left: 20px; + +.product-image caption { + display: block; + margin-top: 10px; + font-size: 0.9em; + color: #90caf9; + font-style: italic; } -.badge { - display: inline-block; - background-color: #263238; - padding: 4px 10px; - margin: 4px 0; - border-radius: 4px; - font-size: 0.85em; + +.product-features h3 { + margin-top: 0; + color: #43a047; + border-bottom: 2px solid #2e3b4a; + padding-bottom: 10px; } -.procurement-badge { - background-color: #1a5276; - color: #fff; - margin-right: 8px; + +.product-subtitle { + color: #cfd8dc; + font-style: italic; + margin-top: -5px; + margin-bottom: 25px; } -.footer { - background-color: #0b0f14; - padding: 20px; - text-align: center; - font-size: 0.85em; - color: #9e9e9e; + +.feature-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 30px; + margin-bottom: 20px; } -.cta-box { - background-color: #1a222b; - padding: 30px; - margin: 40px 0; - border: 1px solid #2e3b4a; - text-align: center; + +.feature-category h4 { + color: #90caf9; + margin-top: 0; + margin-bottom: 15px; + padding-bottom: 8px; + border-bottom: 1px solid #2e3b4a; + font-size: 1.1em; } -.diagram { - background-color: #111820; - padding: 20px; - margin: 20px 0; - border: 1px solid #2e3b4a; + +.feature-category ul { + margin-left: 0; + list-style-type: none; + padding-left: 0; } -.note { - background-color: #1a222b; - padding: 15px; - border-left: 4px solid #90caf9; - margin: 20px 0; + +.feature-category li { + margin-bottom: 12px; + padding-left: 22px; + position: relative; + line-height: 1.5; } -.warning { - background-color: #2d1b1b; - padding: 15px; - border-left: 4px solid #ff6b6b; - margin: 20px 0; + +.feature-category li:before { + content: "•"; + color: #43a047; + position: absolute; + left: 8px; + font-size: 1.2em; } + +.feature-category strong { + color: #cfd8dc; + font-weight: 600; +} + +.product-highlight { + background-color: #2d1b1b; + padding: 15px; + border-left: 4px solid #ff6b6b; + margin-top: 20px; + font-size: 0.95em; +} + +.product-highlight strong { + color: #ff6b6b; +} + +/* ===== ADVANTAGES CARDS ===== */ .advantages { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); - gap: 20px; - margin: 30px 0; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); + gap: 20px; + margin: 30px 0; } + .advantage-card { - background-color: #1a222b; - padding: 20px; - border-radius: 4px; - border-top: 3px solid #43a047; + background-color: #1a222b; + padding: 20px; + border-radius: 4px; + border-top: 3px solid #43a047; } -abbr { - cursor: help; - text-decoration: underline dotted; + +/* ===== TABLES ===== */ +table { + width: 100%; + border-collapse: collapse; + margin-top: 20px; } -/* Product Showcase Styles */ -.product-showcase { - display: grid; - grid-template-columns: 1fr 2fr; - gap: 30px; - margin: 40px 0; - padding: 25px; - background-color: #1a222b; - border: 1px solid #2e3b4a; - border-radius: 8px; - align-items: start; +th, +td { + border: 1px solid #2e3b4a; + padding: 10px; + text-align: left; + vertical-align: top; } -.product-image { - text-align: center; +th { + background-color: #1b2633; } -.product-image img { - width: 100%; - max-width: 300px; - height: auto; - border-radius: 6px; - border: 1px solid #2e3b4a; - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); +/* ===== LISTS ===== */ +ul { + margin-left: 20px; } -.product-image caption { - display: block; - margin-top: 10px; - font-size: 0.9em; - color: #90caf9; - font-style: italic; +/* ===== DIAGRAM ===== */ +.diagram { + background-color: #111820; + padding: 20px; + margin: 20px 0; + border: 1px solid #2e3b4a; } -.product-features h3 { - margin-top: 0; - color: #43a047; - border-bottom: 2px solid #2e3b4a; - padding-bottom: 10px; +/* ===== CALL TO ACTION ===== */ +.cta-box { + background-color: #1a222b; + padding: 30px; + margin: 40px 0; + border: 1px solid #2e3b4a; + text-align: center; +} + +/* ===== NOTES & WARNINGS ===== */ +.note { + background-color: #1a222b; + padding: 15px; + border-left: 4px solid #90caf9; + margin: 20px 0; } -.product-features ul { - margin-left: 20px; - list-style-type: none; +.warning { + background-color: #2d1b1b; + padding: 15px; + border-left: 4px solid #ff6b6b; + margin: 20px 0; } -.product-features li { - margin-bottom: 15px; - padding-left: 25px; - position: relative; - line-height: 1.5; +/* ===== FOOTER ===== */ +.footer { + background-color: #0b0f14; + padding: 20px; + text-align: center; + font-size: 0.85em; + color: #9e9e9e; } -.product-features li:before { - content: "✓"; - color: #43a047; - position: absolute; - left: 0; - font-weight: bold; +/* ===== ACCESSIBILITY & TYPOGRAPHY ===== */ +abbr { + cursor: help; + text-decoration: underline dotted; } -.product-features strong { - color: #90caf9; - font-weight: 600; +/* ===== RESPONSIVE DESIGN ===== */ +@media (max-width: 992px) { + .product-showcase { + grid-template-columns: 1fr; + gap: 20px; + } + + .feature-grid { + grid-template-columns: 1fr; + gap: 25px; + } + + .product-image { + text-align: center; + } + + .product-image img { + max-width: 250px; + } } -/* Responsive adjustments */ @media (max-width: 768px) { - .product-showcase { - grid-template-columns: 1fr; - gap: 20px; - } - - .product-image img { - max-width: 250px; - } + header { + padding: 25px; + } + + section { + padding: 25px 20px; + } + + .advantages { + grid-template-columns: 1fr; + } + + .cta-box { + padding: 20px; + margin: 25px 15px; + } + + header h1 { + font-size: 1.8em; + } + + h2 { + font-size: 1.5em; + } + + h3 { + font-size: 1.2em; + } + + table { + font-size: 0.9em; + } + + th, + td { + padding: 8px 6px; + } +} + +@media (max-width: 480px) { + header { + padding: 20px 15px; + } + + .gap-box { + padding: 15px; + } + + .badge { + display: block; + margin: 5px 0; + width: fit-content; + } + + .procurement-badge { + margin-right: 0; + } + + .advantage-card { + padding: 15px; + } + + .product-showcase { + padding: 15px; + } + + .product-features h3 { + font-size: 1.3em; + } } |