/* Palette from website_content.md (sampled, approximate). Contrast ratios noted are WCAG 2.x, checked at build. */
@font-face{font-family:"Pixelify Sans";src:url(/fonts/PixelifySans.ttf) format("truetype");font-weight:400 700;font-display:swap}
@font-face{font-family:"Inter";src:url(/fonts/Inter.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/fonts/JetBrainsMono.ttf) format("truetype");font-weight:100 800;font-display:swap}
:root{
--night-navy:#0D0D29;--deep-sea:#021627;--ink-teal:#1F5E6B;--hook-teal:#0CADA9;--foam:#91C1C4;
--sunset-orange:#AA4911;     /* white text 5.72:1 AA; vs navy 3.32:1 (non-text OK) */
--sunset-orange-hover:#8F3C0D; /* white text 7.45:1 */
--coin-gold:#C69435;--sun-cream:#FDF3AC;--sand:#FCDD9D;--paper:#FDFAEE;--dock-wood:#4F403A;
--card:#14324A;              /* derived: ink-teal too light for teal/gold text (2.6:1). paper 12.7, gold 4.85, hook-teal 4.77 */
--display:"Pixelify Sans",ui-monospace,monospace;--body:"Inter",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}
*{box-sizing:border-box}html{background:var(--night-navy)}body{margin:0;font:16px/1.6 var(--body);color:var(--paper);background:var(--night-navy)}
h1,h2,h3,.brand,.faq dt{font-family:var(--display);font-weight:700;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}
h1{font-size:clamp(1.9rem,4.5vw,3rem);line-height:1.15}h2{font-size:1.45rem;line-height:1.25}h2.big{font-size:clamp(1.8rem,4vw,2.6rem)}h3{font-size:1.25rem}
a{color:var(--hook-teal)}a:hover{color:var(--sun-cream)}
:focus-visible{outline:3px solid var(--sun-cream);outline-offset:3px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--sun-cream);color:var(--night-navy);padding:8px;z-index:9}
.top{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;align-items:center;justify-content:space-between;padding:.7rem 1.25rem;background:var(--night-navy);border-bottom:3px solid var(--sunset-orange)}
.brand{display:flex;gap:.6rem;align-items:center;color:var(--paper);text-decoration:none;font-size:1.4rem}.brand img{border-radius:4px}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem 1.1rem;margin:0;padding:0}nav a{color:var(--paper);text-decoration:none;padding:.25rem 0}
nav a[aria-current=page],nav a:hover{color:var(--sand);box-shadow:inset 0 -3px 0 var(--hook-teal)}
.hero{position:relative;background:var(--deep-sea);overflow:hidden}
.hero-art{position:relative;max-width:1600px;margin:0 auto}
.hero-img{display:block;width:100%;height:auto}
/* Dark gradient over the (already blurred) area where the source art had baked-in text */
.hero-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,13,41,.92) 0%,rgba(13,13,41,.82) 38%,rgba(13,13,41,0) 58%),linear-gradient(180deg,rgba(13,13,41,.35),rgba(13,13,41,0) 30%)}
.hero-in{position:absolute;top:0;bottom:0;left:max(0px,calc((100% - 1600px) / 2));margin:0;padding:clamp(1rem,4vw,3.5rem) clamp(1rem,4vw,3.5rem);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:min(52%,760px)}
.hero h1{margin:0 0 .6rem;font-size:clamp(2rem,4.2vw,4rem);line-height:1.05;text-shadow:3px 3px 0 var(--night-navy)}
.hero .lead{font-size:clamp(1rem,1.3vw,1.2rem);margin:0 0 1.1rem;text-shadow:0 1px 2px var(--night-navy)}
.accent{color:var(--hook-teal)}
.strip-wrap{max-width:1100px;margin:0 auto;padding:1rem 1.25rem 0}
@media (max-width:860px){
  .hero-img{height:230px;object-fit:cover;object-position:78% 60%}
  .hero-art::after{background:linear-gradient(180deg,rgba(13,13,41,0) 55%,var(--deep-sea))}
  .hero-in{position:static;width:auto;padding:1.25rem}
}
@media (min-width:861px) and (max-width:1180px){
  .hero-in{width:58%}.hero .lead{font-size:.95rem}.hero .lead strong{display:block}
}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lead{font-size:1.15rem;max-width:65ch}.ctas{display:flex;flex-wrap:wrap;gap:1rem}
.strip{list-style:none;padding:0;margin:1.25rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}
.strip li{border:2px solid var(--ink-teal);padding:.25rem .6rem;font-size:.9rem}.strip b{color:var(--coin-gold)}
.wrap{max-width:1100px;margin:0 auto;padding:2rem 1.25rem}.narrow{max-width:780px}.center{text-align:center}
.band{background:var(--deep-sea);border-block:3px solid var(--ink-teal)}
.two,.grid2{display:grid;gap:1.5rem 2.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.grid2{margin:1.5rem 0}
.btn{font-family:var(--body);font-weight:700;display:inline-block;font-size:1.05rem;padding:.7rem 1.1rem;border:2px solid var(--night-navy);cursor:pointer;color:#fff;background:var(--sunset-orange);text-decoration:none;box-shadow:4px 4px 0 var(--night-navy),4px 4px 0 2px var(--coin-gold)}
.btn:hover{background:var(--sunset-orange-hover);color:#fff}.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--night-navy)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.alt{background:var(--hook-teal);color:var(--night-navy);box-shadow:4px 4px 0 var(--night-navy),4px 4px 0 2px var(--foam)} /* 6.84:1 */
.btn.alt:hover{background:var(--foam);color:var(--night-navy)}.btn.sm{font-size:.85rem;padding:.4rem .7rem}
.grid,.steps{list-style:none;padding:0;display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.steps{counter-reset:s}
.steps li{counter-increment:s}.steps h2::before{content:counter(s)". ";color:var(--coin-gold)}
.card{background:var(--card);border:3px solid var(--ink-teal);padding:1.1rem 1.25rem;box-shadow:5px 5px 0 var(--deep-sea);margin-bottom:1.25rem}
.grid .card,.steps .card,.grid2 .card{margin-bottom:0}.card h2,.card h3{margin-top:0;color:var(--sand)}
.price{color:var(--coin-gold);font-weight:700}.small{font-size:.875rem;color:var(--foam)}
code{font-family:var(--mono);background:var(--deep-sea);padding:.1rem .35rem;color:var(--sand);font-size:.92em}
mark.tbd{background:transparent;color:var(--sun-cream);border:2px dashed var(--coin-gold);padding:0 .3rem;font-size:.9em}
.tbd-tag{font-family:var(--mono);font-weight:700;background:var(--coin-gold);color:var(--night-navy);padding:0 .25rem;margin-right:.2rem;font-size:.8em}
.tscroll{overflow-x:auto}.ptable{width:100%;border-collapse:collapse;background:var(--card);border:3px solid var(--ink-teal)}.ptable caption{text-align:left;padding:.5rem 0;color:var(--foam)}
.ptable th,.ptable td{padding:.6rem .8rem;border-bottom:2px solid var(--deep-sea);text-align:left}.ptable thead{background:var(--deep-sea);color:var(--sand)}.ptable td:nth-child(2){color:var(--coin-gold);font-weight:700}
.faq{border:3px solid var(--ink-teal);background:var(--card);margin:.75rem 0;padding:.75rem 1rem}.faq dt{font-family:var(--display);font-weight:700;font-size:1.2rem;color:var(--sand)}.faq dd{margin:.4rem 0 0}
.demo{background:var(--sun-cream);color:var(--night-navy);padding:.6rem 1rem;border:3px dashed var(--sunset-orange)}
.dash{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.dash .card{margin:0}
.claim{border-top:2px solid var(--ink-teal);margin-top:1rem;padding-top:.75rem}.claim label{display:block;font-weight:600}.claim .row{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;margin:.3rem 0}
.claim input{font:inherit;font-family:var(--mono);padding:.35rem .5rem;background:var(--paper);color:var(--night-navy);border:2px solid var(--night-navy);flex:1 1 8rem;min-width:0;max-width:14rem}.suffix{font-family:var(--mono);color:var(--sand)}
.ok{color:var(--hook-teal)}.bad{color:var(--sand)}.claim input[aria-invalid=true]{border-color:var(--sunset-orange);outline:2px solid var(--sunset-orange)}
.bal{font-family:var(--mono);font-weight:800;font-size:2.4rem;color:var(--coin-gold);margin:.25rem 0}.status{font-weight:700;padding:.1rem .5rem}.status.on{background:var(--hook-teal);color:var(--night-navy)}.status.off{background:var(--dock-wood);color:var(--paper)}
fieldset{border:2px solid var(--ink-teal);margin:0 0 .75rem}.radio{display:block;padding:.15rem 0}
select,input[type=time]{font:inherit;padding:.35rem;background:var(--paper);color:var(--night-navy);border:2px solid var(--night-navy);max-width:100%}label{margin-right:.3rem}select{display:block;width:100%;margin:.3rem 0 .6rem}
.foot{padding:1.5rem 1.25rem;background:var(--deep-sea);border-top:3px solid var(--ink-teal);text-align:center}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
