/* Sunline Solar Group — brand stylesheet.
   Palette: deep navy #0a1f33, sun amber #f6b325, warm off-white #faf7ef,
   ink #1c2430. All text/background pairs targeted at WCAG AA. */
:root{
  --navy:#0a1f33; --navy-2:#0e2a44; --amber:#f6b325; --amber-dark:#b45309;
  --paper:#faf7ef; --paper-2:#f3ecdc; --ink:#1c2430; --ink-soft:#3d4a5c;
  --line:#e3d9c2; --ok:#2f7d4f; --danger:#b3261e;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Segoe UI',Verdana,Helvetica,Arial,sans-serif;background:var(--paper);color:var(--ink);line-height:1.65;font-size:1rem}
img{max-width:100%;height:auto}
a{color:var(--amber-dark);text-decoration:underline;text-underline-offset:2px}
a:hover{color:#8a3d06}
.wrap{max-width:1100px;margin:0 auto;padding:0 22px}
.center{text-align:center}

/* Keyboard focus — visible everywhere */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--amber);outline-offset:2px;border-radius:4px}

/* Skip links */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:200;border-radius:0 0 6px 0}
.skip-link:focus{left:0}

/* Header / nav */
.site-header{background:var(--navy);color:#fff;position:sticky;top:0;z-index:100;box-shadow:0 2px 12px rgba(0,0,0,.25)}
.nav{max-width:1200px;margin:0 auto;padding:12px 22px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.brand{color:#fff;text-decoration:none;font-weight:800;letter-spacing:1px;font-size:1.12rem;display:flex;align-items:center;gap:10px}
.brand .sun{color:var(--amber)}
.brand svg{flex:0 0 auto}
.nav-links{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto;align-items:center}
.nav-links a{color:#fff;text-decoration:none;padding:8px 10px;border-radius:6px;font-size:.95rem}
.nav-links a:hover,.nav-links a:focus-visible{background:rgba(246,179,37,.18);color:#fff}
.nav-links a[aria-current="page"]{background:rgba(246,179,37,.28);font-weight:700}
.nav-cta{background:var(--amber)!important;color:var(--navy)!important;font-weight:800}
.nav-cta:hover{background:#ffc94d!important}
.menu-btn{display:none;background:none;border:2px solid var(--amber);color:#fff;border-radius:8px;padding:8px 12px;font-size:1rem;cursor:pointer}

/* Hero */
.hero{position:relative;color:#fff;overflow:hidden;background:var(--navy);min-height:74vh;display:flex;align-items:center}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,31,51,.88) 20%,rgba(10,31,51,.55) 55%,rgba(10,31,51,.25) 100%)}
.hero-content{position:relative;z-index:2;padding:80px 22px;max-width:1100px}
.hero-tag{display:inline-block;background:rgba(246,179,37,.2);border:1px solid var(--amber);color:var(--amber);font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:.78rem;padding:6px 14px;border-radius:999px;margin-bottom:18px}
.hero h1{font-size:clamp(2.4rem,6vw,4.2rem);line-height:1.08;margin:0 0 18px;max-width:16ch}
.lead{font-size:1.18rem;max-width:44rem;color:#f2ecdd}
.hero .lead{color:#f5efe0}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-block;background:var(--amber);color:var(--navy);font-weight:800;padding:14px 28px;border-radius:10px;text-decoration:none;border:2px solid var(--amber);cursor:pointer;font-size:1.02rem}
.btn:hover{background:#ffc94d;border-color:#ffc94d;color:var(--navy)}
.btn-outline{background:transparent;color:#fff;border-color:#fff}
.btn-outline:hover{background:rgba(255,255,255,.14);color:#fff;border-color:#fff}
.btn-dark{background:var(--navy);border-color:var(--navy);color:#fff}
.btn-dark:hover{background:var(--navy-2);border-color:var(--navy-2);color:#fff}
.video-credit{position:absolute;bottom:10px;right:14px;z-index:3;font-size:.72rem;color:rgba(255,255,255,.75)}
.video-credit a{color:rgba(255,255,255,.85)}

/* Sections */
section{padding:64px 0}
.section-soft{background:var(--paper-2)}
.section-dark{background:var(--navy);color:#f2ecdd}
.section-dark h2,.section-dark h3{color:#fff}
.section-dark .lead{color:#e8dfc9}
.eyebrow{color:var(--amber-dark);font-weight:800;letter-spacing:2px;text-transform:uppercase;font-size:.8rem;margin:0 0 10px}
.section-dark .eyebrow{color:var(--amber)}
h2{font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.2;margin:0 0 14px}
h3{font-size:1.25rem;margin:0 0 8px}
p{margin:0 0 14px}

/* Cards & grids */
.grid{display:grid;gap:20px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:0 2px 10px rgba(10,31,51,.06)}
.card h3{margin-top:0}
.card .icon{font-size:1.8rem;display:block;margin-bottom:10px}
.section-dark .card{background:var(--navy-2);border-color:#23425f;color:#eef2f7}
.section-dark .card h3{color:#fff}
.callout{background:#fff8e8;border-left:6px solid var(--amber);border-radius:0 12px 12px 0;padding:20px 24px;margin:24px 0}
.callout.warn{border-left-color:var(--danger);background:#fdf0ef}
.fine{font-size:.88rem;color:var(--ink-soft)}
.section-dark .fine{color:#c9d3de}

/* Stats */
.stat-row{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;margin-top:32px}
.stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 30px;min-width:200px;flex:1;max-width:300px}
.stat .num{font-size:2rem;font-weight:800;color:var(--navy)}
.stat .cap{font-size:.95rem;color:var(--ink-soft)}

/* Steps */
.steps{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:28px}
.step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px}
.step-num{width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--amber);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:14px}

/* Pricing */
.price-card{background:#fff;border:2px solid var(--navy);border-radius:16px;padding:34px;max-width:520px;margin:0 auto;text-align:center}
.price{font-size:3.2rem;font-weight:800;color:var(--navy)}
.price-note{display:inline-block;background:#fff8e8;border:1px dashed var(--amber-dark);border-radius:8px;padding:8px 14px;font-size:.9rem;margin:14px 0}
ul.check{list-style:none;padding:0}
ul.check li{padding:8px 0 8px 34px;position:relative;text-align:left}
ul.check li::before{content:"✓";position:absolute;left:4px;color:var(--ok);font-weight:800}

/* Forms */
.field{margin-bottom:16px}
label{display:block;font-weight:700;margin-bottom:6px}
input[type=text],input[type=email],input[type=tel],select,textarea{width:100%;padding:12px 14px;border:2px solid #b9c2cf;border-radius:10px;font-size:1rem;font-family:inherit;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--amber-dark)}
.hint{font-size:.85rem;color:var(--ink-soft);margin-top:4px}

/* Tables */
.table-wrap{overflow-x:auto;margin:24px 0}
table{border-collapse:collapse;width:100%;background:#fff;border-radius:12px;overflow:hidden}
th,td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line)}
th{background:var(--navy);color:#fff}
tr:last-child td{border-bottom:none}

/* Tree of life / footer */
.tree-of-life{background:var(--navy-2);color:#f2ecdd;text-align:center;padding:34px 22px}
.tree-quote{font-size:1.35rem;font-style:italic;color:var(--amber);margin:0 0 8px}
.tree-match{margin:0}
.tree-match a{color:#fff;font-weight:700}
.site-footer{background:var(--navy);color:#dfe6ee;padding:44px 0 30px;font-size:.95rem}
.site-footer .wrap{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.site-footer a{color:var(--amber)}
.site-footer strong{color:#fff}
.wa-link{display:inline-block;margin-top:8px}
.nl-block{margin-top:18px}
.nl-block h4{color:#fff;margin:0 0 6px}
.transparency-line{margin-top:18px;font-size:.85rem;color:#c9d3de}
.legal-line{font-size:.8rem;color:#9fb0c2;margin-top:14px;max-width:70rem}

/* A11y toolbar */
#a11y-toolbar{position:fixed;left:10px;bottom:10px;z-index:300;display:flex;gap:6px;background:rgba(10,31,51,.92);padding:8px;border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.3)}
#a11y-toolbar button{background:#1d3a5c;color:#fff;border:1px solid #3a5a80;border-radius:8px;min-width:42px;min-height:42px;font-size:1rem;cursor:pointer}
#a11y-toolbar button:hover{background:#2a4a70}
#a11y-toolbar button[aria-pressed="true"]{background:var(--amber);color:var(--navy);border-color:var(--amber)}
body.a11y-contrast{background:#000;color:#fff}
body.a11y-contrast .card,body.a11y-contrast .stat,body.a11y-contrast .step,body.a11y-contrast table,body.a11y-contrast .price-card{background:#111;color:#fff;border-color:#fff}
body.a11y-contrast a{color:#ffd75e}
body.a11y-contrast .section-soft{background:#0a0a0a}
body.a11y-contrast .fine,body.a11y-contrast .cap,body.a11y-contrast .hint{color:#e8e8e8}

/* Gate page */
.gate-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 30%,#123453,var(--navy) 70%);color:#fff;padding:24px}
.gate-card{background:rgba(255,255,255,.06);border:1px solid rgba(246,179,37,.4);border-radius:18px;padding:44px;max-width:440px;width:100%;text-align:center;backdrop-filter:blur(4px)}
.gate-card h1{color:var(--amber)}
.gate-card input{margin:14px 0}
.gate-error{color:#ff9d94;min-height:1.4em;font-weight:700}

/* FAQ */
details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin-bottom:12px}
summary{font-weight:800;cursor:pointer;color:var(--navy)}

/* Chatbot widget: sizing hooks (details in chatbot.css) */
#brand-chatbot{position:fixed;right:18px;bottom:18px;z-index:400}

/* Responsive */
@media (max-width:760px){
  .menu-btn{display:inline-block}
  .nav-links{display:none;width:100%;flex-direction:column;align-items:stretch}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px}
  section{padding:44px 0}
  #a11y-toolbar{left:6px;bottom:6px}
  #brand-chatbot{right:10px;bottom:64px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Brand logo rollout 2026-10-05 */
.brand-logo{height:2.5rem;width:auto;border-radius:.5rem;vertical-align:middle;margin-right:.55rem;background:#0a1f44}
.footer-logo{display:block;height:3.25rem;width:auto;border-radius:.6rem;margin:0 auto 1.25rem;background:#0a1f44}