@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--color-primary:#222;--color-secondary:#00a699;--color-accent:#ff5a5f;--color-bg:#fff;--color-bg-sand:#f7f7f7;--color-text:#222;--color-text-light:#717171;--color-white:#fff;--spacing-sm:.5rem;--spacing-md:1rem;--spacing-lg:2rem;--spacing-xl:4rem;--border-radius:16px;--shadow:0 6px 16px #00000014, 0 2px 4px #0000000a}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--color-text);background-color:var(--color-bg);font-family:Inter,sans-serif;line-height:1.6}h1,h2,h3,h4{color:var(--color-primary);line-height:1.2}a{color:var(--color-secondary);text-decoration:none}.btn-primary{background-color:var(--color-accent);color:var(--color-white);border-radius:var(--border-radius);cursor:pointer;text-align:center;border:none;padding:.75rem 1.5rem;font-weight:600;transition:transform .2s,background-color .2s;display:inline-block}.btn-primary:hover{color:var(--color-white);background-color:#e0484d;transform:scale(.98)}.container{max-width:1200px;padding:0 var(--spacing-lg);margin:0 auto}header{background-color:var(--color-white);z-index:100;padding:.5rem 0;position:sticky;top:0;box-shadow:0 1px 3px #0000001a}.nav-container{justify-content:space-between;align-items:center;display:flex}.logo{color:var(--color-primary);font-size:1.5rem;font-weight:800}nav ul{gap:var(--spacing-lg);list-style:none;display:flex}nav a{color:var(--color-text);font-weight:500;transition:color .2s}nav a:hover{color:var(--color-secondary)}.hero{height:70vh;min-height:400px;color:var(--color-white);background-image:linear-gradient(#2226,#2223),url(/hero.png);background-position:50%;background-size:cover;align-items:center;display:flex;position:relative}.hero-content{max-width:800px}.hero h1{color:var(--color-white);margin-bottom:var(--spacing-md);font-size:clamp(2.5rem,5vw,4rem);font-weight:800}.hero p{margin-bottom:var(--spacing-lg);opacity:.9;font-size:1.25rem}.live-dashboard-section{background-color:var(--color-bg);z-index:10;position:relative}.dashboard-grid{gap:var(--spacing-lg);grid-template-columns:repeat(auto-fit,minmax(300px,1fr));display:grid}.dashboard-widget{background:var(--color-white);border-radius:var(--border-radius);padding:var(--spacing-lg);box-shadow:var(--shadow);border-top:4px solid var(--color-accent);transition:transform .2s,box-shadow .2s}.dashboard-widget:hover{transform:translateY(-2px);box-shadow:0 12px 24px #0000001f}.dashboard-widget h3{margin-bottom:var(--spacing-md);color:var(--color-primary);align-items:center;gap:.5rem;font-size:1.25rem;display:flex}.widget-data{color:var(--color-text);margin-bottom:var(--spacing-sm);min-height:60px;font-size:1.5rem;font-weight:700}.widget-data.loading{color:var(--color-text-light);font-size:1rem;font-weight:400}.tide-row{border-bottom:1px solid #e2e8f0;justify-content:space-between;margin-bottom:.5rem;padding-bottom:.5rem;font-size:1.1rem;font-weight:500;display:flex}.tide-row:last-child{border-bottom:none}.widget-meta{color:var(--color-text-light);margin-top:var(--spacing-sm);font-size:.875rem}section{padding:var(--spacing-xl) 0}.section-header{text-align:center;margin-bottom:var(--spacing-xl)}.section-header h2{margin-bottom:var(--spacing-sm);font-size:2.5rem}.section-header p{color:var(--color-text-light);font-size:1.125rem}.grid-2{gap:var(--spacing-lg);grid-template-columns:repeat(auto-fit,minmax(300px,1fr));display:grid}.bento-grid{gap:var(--spacing-md);grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(200px,auto);display:grid}.bento-card{background:var(--color-white);border-radius:var(--border-radius);padding:var(--spacing-lg);box-shadow:var(--shadow);border:1px solid #0000000d;flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex}.bento-card:hover{transform:translateY(-2px);box-shadow:0 12px 24px #0000001f}.bento-card h3{margin-bottom:var(--spacing-md);font-size:1.5rem}.bento-span-4{grid-column:span 4}.bento-span-6{grid-column:span 6}.bento-span-8{grid-column:span 8}.bento-span-12{grid-column:span 12}@media (width<=992px){.bento-span-4,.bento-span-6,.bento-span-8{grid-column:span 12}}.icon-list{margin-top:var(--spacing-sm);list-style:none}.icon-list li{color:var(--color-text);align-items:center;gap:.75rem;margin-bottom:.75rem;font-weight:500;display:flex}.icon-list-icon{background:#0000000a;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.25rem;display:flex}.card{background:var(--color-white);border-radius:var(--border-radius);padding:var(--spacing-lg);box-shadow:var(--shadow);border-top:4px solid var(--color-secondary)}.card h3{margin-bottom:var(--spacing-md);font-size:1.5rem}.split-section{gap:var(--spacing-xl);grid-template-columns:1fr 1fr;align-items:center;display:grid}.split-image img{border-radius:var(--border-radius);width:100%;box-shadow:var(--shadow);object-fit:cover;aspect-ratio:4/3}.split-content h2{margin-bottom:var(--spacing-md);font-size:2.5rem}.bg-sand{background-color:var(--color-bg-sand)}.bg-blue{background-color:var(--color-primary);color:var(--color-white)}.bg-blue h2,.bg-blue h3{color:var(--color-white)}.faq-container{max-width:800px;margin:0 auto}.faq-item{margin-bottom:var(--spacing-sm);border-bottom:1px solid #e2e8f0}.faq-question{text-align:left;width:100%;padding:var(--spacing-md) 0;color:var(--color-primary);cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;font-size:1.125rem;font-weight:600;display:flex}.faq-icon{font-size:1.5rem;transition:transform .2s}.faq-answer{max-height:0;transition:max-height .3s ease-out;overflow:hidden}.faq-answer p{padding-bottom:var(--spacing-md);color:var(--color-text)}.faq-item.active .faq-answer{max-height:500px}.faq-item.active .faq-icon{transform:rotate(45deg)}footer{background-color:var(--color-primary);color:var(--color-white);padding:var(--spacing-xl) 0 var(--spacing-lg);text-align:center;border-top:1px solid #ffffff0d}.footer-content{opacity:.8}.text-center{text-align:center}.mt-lg{margin-top:var(--spacing-lg)}@media (width<=768px){.split-section{grid-template-columns:1fr}nav ul{display:none}.live-dashboard-section{margin-top:var(--spacing-md)}}.blog-grid{gap:var(--spacing-lg);margin-top:var(--spacing-lg);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.blog-card{background:var(--color-white);border-radius:var(--border-radius);box-shadow:var(--shadow);border:1px solid #0000000d;flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.blog-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #0000001f}.blog-card-img-link{aspect-ratio:16/9;display:block;overflow:hidden}.blog-card-image{object-fit:cover;width:100%;height:100%;transition:transform .3s}.blog-card:hover .blog-card-image{transform:scale(1.05)}.blog-card-content{padding:var(--spacing-md);flex-direction:column;flex-grow:1;display:flex}.blog-meta{margin-bottom:var(--spacing-sm);justify-content:space-between;align-items:center;font-size:.875rem;display:flex}.blog-category{background:var(--color-bg-sand);color:var(--color-primary);border-radius:9999px;padding:.25rem .75rem;font-weight:600}.blog-date{color:var(--color-text-light)}.blog-title{margin-bottom:var(--spacing-sm);font-size:1.25rem}.blog-title a{color:var(--color-primary)}.blog-title a:hover{color:var(--color-secondary)}.blog-excerpt{color:var(--color-text-light);margin-bottom:var(--spacing-md);-webkit-line-clamp:3;-webkit-box-orient:vertical;flex-grow:1;display:-webkit-box;overflow:hidden}.blog-read-more{color:var(--color-secondary);align-items:center;font-weight:600;display:inline-flex}.blog-read-more:hover{text-decoration:underline}.breadcrumb{margin-top:var(--spacing-lg);margin-bottom:var(--spacing-md);font-size:.875rem}.breadcrumb ol{flex-wrap:wrap;gap:.5rem;list-style:none;display:flex}.breadcrumb li{align-items:center;display:flex}.breadcrumb li+li:before{content:"/";color:var(--color-text-light);margin-right:.5rem}.breadcrumb a{color:var(--color-text-light)}.breadcrumb a:hover{color:var(--color-secondary)}.breadcrumb [aria-current=page]{color:var(--color-primary);font-weight:500}.blog-article{background:var(--color-white);border-radius:var(--border-radius);max-width:800px;padding:var(--spacing-xl);box-shadow:var(--shadow);margin:0 auto;margin-bottom:var(--spacing-xl)}.article-header{margin-bottom:var(--spacing-xl);text-align:center}.article-meta{margin-bottom:var(--spacing-md);color:var(--color-text-light);justify-content:center;align-items:center;gap:1rem;font-size:.9rem;display:flex}.article-meta .category{background:var(--color-bg-sand);color:var(--color-primary);border-radius:9999px;padding:.25rem .75rem;font-weight:600}.article-title{margin-bottom:var(--spacing-md);font-size:clamp(2rem,4vw,3rem)}.author-info{margin-bottom:var(--spacing-lg)}.article-hero-image img{object-fit:cover;border-radius:var(--border-radius);width:100%;max-height:400px;margin-top:var(--spacing-md)}.article-body{color:var(--color-text);font-size:1.125rem;line-height:1.8}.article-body h2{margin-top:2rem;margin-bottom:1rem;font-size:2rem}.article-body h3{margin-top:1.5rem;margin-bottom:.75rem;font-size:1.5rem}.article-body p{margin-bottom:1.25rem}.article-body ul,.article-body ol{margin-bottom:1.25rem;padding-left:2rem}.article-body li{margin-bottom:.5rem}.article-body a{text-underline-offset:2px;text-decoration:underline}.article-body blockquote{border-left:4px solid var(--color-secondary);color:var(--color-text-light);background:var(--color-bg-sand);border-radius:0 var(--border-radius) var(--border-radius) 0;margin-bottom:1.25rem;margin-left:0;padding:1rem;font-style:italic}.related-articles{max-width:800px;margin:0 auto var(--spacing-xl);text-align:center;padding-top:var(--spacing-lg);border-top:1px solid #0000000d}.ad-slot-container{width:100%;padding:var(--spacing-md) 0;background-color:#0000;justify-content:center;align-items:center;display:flex}.ad-slot{color:#888;text-transform:uppercase;letter-spacing:1px;background-color:#f1f1f1;border:1px dashed #ccc;border-radius:4px;justify-content:center;align-items:center;font-size:.875rem;font-weight:500;display:flex}.ad-leaderboard{width:100%;max-width:728px;height:90px}.ad-mpu{width:100%;max-width:300px;height:250px;margin:2rem auto}
