:root{
  --stage:#0b1730; --stage-2:#122244; --gold:#f5a623; --bulb:#ffd36b;
  --paper:#f6f1e7; --ink:#1d1d1d; --soft:#b9c3da; --line:#2b3d63;
  --serif:"Playfair Display",Georgia,serif; --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--stage);color:var(--paper);font:400 1.0625rem/1.6 var(--sans)}
h1,h2,h3{font-family:var(--serif);line-height:1.15;margin:0}
h1{font-size:clamp(2.2rem,5.5vw,3.9rem);font-weight:800;letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,3.5vw,2.3rem);font-weight:600}
h3{font-size:1.25rem;font-weight:600}
p{margin:0}
a{color:var(--bulb)}
:focus-visible{outline:3px solid var(--bulb);outline-offset:3px}
section{max-width:1080px;margin:0 auto;padding:4.5rem 1.5rem}

.top{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1.5rem;max-width:1080px;margin:0 auto}
.brand img{display:block;border-radius:6px}
.top nav{display:flex;align-items:center;gap:1.5rem}
.top nav a{text-decoration:none;color:var(--paper);font-weight:500}
.top nav a:hover{color:var(--bulb)}

/* Marquee bulbs: two interleaved rows that take turns lighting up */
.bulbs{position:relative;height:18px;overflow:hidden}
.bulbs i{position:absolute;inset:0;
  background:radial-gradient(circle,var(--bulb) 0 4px,rgba(245,166,35,.35) 5px,transparent 9px) 0 50%/36px 18px repeat-x;
  filter:drop-shadow(0 0 5px var(--gold))}
.bulbs .b{background-position:18px 50%;animation:blink 1.6s steps(1) infinite}
.bulbs .a{animation:blink 1.6s steps(1) infinite reverse}
@keyframes blink{50%{opacity:.2}}

.btn{display:inline-block;background:var(--gold);color:#1d1d1d;font:700 1rem var(--sans);padding:.9rem 1.6rem;border:0;border-radius:999px;cursor:pointer;text-decoration:none;box-shadow:0 0 22px rgba(245,166,35,.35);transition:transform .15s,background .15s}
.btn:hover{background:var(--bulb);transform:translateY(-1px)}
.btn.small{padding:.5rem 1.1rem;box-shadow:none}
.fine{color:var(--soft);font-size:.9rem}

.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;padding-top:4rem}
.hero-copy{display:grid;gap:1.4rem;justify-items:start}
.hero-copy>p:not(.fine){font-size:1.2rem;color:var(--soft);max-width:34rem}
.hero-card{position:relative;height:300px}
.hero-card .bc{position:absolute;width:min(330px,80%);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.hero-card .bc:first-child{top:0;left:0;transform:rotate(-4deg)}
.hero-card .bc:last-child{bottom:0;right:0;transform:rotate(3deg)}

.how ol{list-style:none;counter-reset:s;padding:0;margin:2rem 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.how li{counter-increment:s;border-top:2px solid var(--gold);padding-top:1rem}
.how li h3::before{content:counter(s) ". ";color:var(--gold)}
.how li p{color:var(--soft);margin-top:.4rem}

.sub{color:var(--soft);margin:.5rem 0 2rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;align-items:stretch}
.card{background:var(--stage-2);border:1px solid var(--line);border-radius:14px;padding:1.75rem;display:flex;flex-direction:column;gap:.75rem}
.card.pop{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 0 30px rgba(245,166,35,.2)}
.card .flag{align-self:flex-start;background:var(--gold);color:#1d1d1d;font-weight:700;font-size:.8rem;padding:.15rem .7rem;border-radius:999px}
.card .for{color:var(--soft);font-size:.95rem}
.price{font:800 2.2rem var(--serif);color:var(--bulb)}
.card ul{list-style:none;padding:0;margin:.5rem 0 1rem;display:grid;gap:.45rem;flex:1}
.card li::before{content:"✓";color:var(--gold);margin-right:.6rem}
.card .btn{text-align:center}
.loading{color:var(--soft)}

.builder{background:var(--stage-2);max-width:none;border-top:1px solid var(--line)}
.builder>*{max-width:1080px;margin-left:auto;margin-right:auto}
.builder-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;margin-top:2rem;align-items:start}
#chosen-name{color:var(--bulb)}
fieldset{border:0;padding:0;margin:0 0 1.75rem;display:grid;gap:1rem}
legend{font:600 1.15rem var(--serif);padding:0;margin-bottom:.75rem}
label{display:grid;gap:.35rem;font-weight:500}
input[type=text],input[type=email],input[type=tel],input:not([type]),input[type=file]{font:inherit;color:var(--ink);background:var(--paper);border:2px solid transparent;border-radius:10px;padding:.7rem .85rem}
input[type=file]{color:var(--soft);background:transparent;border:1px dashed var(--line)}
input:focus{border-color:var(--gold);outline:none}
input[aria-invalid=true]{border-color:#ff8a7a}
.row{display:flex;flex-wrap:wrap;gap:.6rem}
.chip{display:flex;align-items:center;gap:.5rem;border:2px solid var(--line);border-radius:999px;padding:.4rem 1rem;cursor:pointer}
.chip:has(input:checked){border-color:var(--gold);background:rgba(245,166,35,.15)}
.chip input{accent-color:var(--gold)}
.sw{width:40px;height:40px;border-radius:50%;border:3px solid var(--stage-2);box-shadow:0 0 0 2px var(--line);background:var(--c);cursor:pointer;padding:0}
.sw[aria-checked=true]{box-shadow:0 0 0 3px var(--paper)}
.error{color:#ff8a7a;margin-bottom:1rem}

.preview{position:sticky;top:1rem;display:grid;gap:1rem}
.tabs{display:flex;gap:.5rem}
.tabs button{font:500 1rem var(--sans);background:none;color:var(--soft);border:0;border-bottom:2px solid transparent;padding:.4rem .8rem;cursor:pointer}
.tabs button[aria-selected=true]{color:var(--paper);border-color:var(--gold)}
.stage{background:var(--stage-2);border-radius:14px;padding:2rem;display:grid;place-items:center;min-height:340px}

/* Business card */
.bc{--c:#f5a623;aspect-ratio:1.75;width:100%;max-width:360px;border-radius:6px;padding:7% 8%;display:flex;flex-direction:column;justify-content:space-between;color:#1d1d1d;background:#fff;overflow:hidden;position:relative;font-size:clamp(.68rem,1.3vw,.82rem);line-height:1.35}
.bc b{font:800 1.35em var(--serif);display:block}
.bc span{display:block;opacity:.75}
.bc small{font-size:1em;opacity:.8}
.bc img{height:26px;width:auto;object-fit:contain;align-self:flex-start}
.t-classic{border-left:8px solid var(--c);background:#fffdf8}
.t-bold{background:var(--c);color:#fff}
.t-bold b,.t-bold small,.t-bold span{color:#fff;opacity:1}
.t-minimal{align-items:center;text-align:center;justify-content:center;gap:.4rem;border-bottom:4px solid var(--c)}
.t-minimal img{align-self:center}

/* Letterhead */
.lh{--c:#f5a623;width:100%;max-width:300px;aspect-ratio:.707;background:#fffdf8;color:#1d1d1d;padding:8% 9%;display:flex;flex-direction:column;font-size:.62rem;line-height:1.4;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.lh header{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem;border-bottom:3px solid var(--c);padding-bottom:.6rem}
.lh header b{font:800 1.5em var(--serif);display:block}
.lh header em{font-style:normal;opacity:.7}
.lh img{height:28px;width:auto}
.lh .body{flex:1;padding-top:1rem}
.lh .body i{display:block;height:5px;background:#e6e1d6;margin-bottom:.5rem;border-radius:3px}
.lh .body i:nth-child(3n){width:70%}
.lh footer{border-top:1px solid #ccc;padding-top:.5rem;opacity:.8;text-align:center;display:block;margin:0;max-width:none}
.lh.t-bold header{background:var(--c);color:#fff;padding:.7rem;border:0;margin:-8% -9% 0;padding:8% 9% .8rem}
.lh.t-minimal header{flex-direction:column;align-items:center;text-align:center;border-bottom:1px solid var(--c)}

.confirm{text-align:center;display:grid;gap:1rem;justify-items:center}
code{background:var(--stage-2);padding:.15rem .5rem;border-radius:6px;color:var(--bulb)}
footer{text-align:center;color:var(--soft);padding:2rem 1rem}

@media (max-width:820px){
  .hero,.builder-grid,.how ol{grid-template-columns:1fr}
  .hero-card{height:260px}
  .preview{position:static}
  .top nav{gap:.9rem}.top nav a{font-size:.95rem}.top nav a.hide-m{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Company registration wizard */
.reg{max-width:720px;margin:0 auto;padding:3rem 1.5rem 4rem}
.reg-intro{display:grid;gap:.8rem;margin-bottom:2rem}
.reg-intro p{color:var(--soft)}
.progress{list-style:none;display:flex;gap:.4rem;padding:0;margin:0 0 2rem;counter-reset:p}
.progress li{flex:1;counter-increment:p;font-size:.85rem;color:var(--soft);border-top:4px solid var(--line);padding-top:.5rem}
.progress li::before{content:counter(p) ". "}
.progress li.done{border-color:var(--gold)}
.progress li.now{border-color:var(--bulb);color:var(--paper);font-weight:700}
.step{padding:0;max-width:none;display:grid;gap:1rem}
.step[hidden],[hidden]{display:none!important}
.hint{color:var(--soft);font-size:.98rem}
select{font:inherit;color:var(--ink);background:var(--paper);border:2px solid transparent;border-radius:10px;padding:.7rem .85rem}
select:focus{border-color:var(--gold);outline:none}
.check{display:flex;gap:.7rem;align-items:flex-start;font-weight:400}
.check input{margin-top:.35rem;accent-color:var(--gold);width:1.1rem;height:1.1rem;flex:none}
.person{background:var(--stage-2);border:1px solid var(--line);border-radius:14px;padding:1.25rem;margin:0 0 1rem}
.person legend{padding:0 .5rem}
.btn.ghost{background:none;color:var(--paper);border:2px solid var(--line);box-shadow:none}
.btn.ghost:hover{border-color:var(--gold);background:none}
.btn:disabled{opacity:.6;cursor:wait}
.link{background:none;border:0;color:var(--soft);text-decoration:underline;cursor:pointer;font:inherit;justify-self:start;padding:0}
.total{font-weight:700;color:#ff8a7a}.total.ok{color:#7fd6a4}
.summary{display:grid;gap:1rem}
.summary div{background:var(--stage-2);border-radius:12px;padding:1rem 1.25rem}
.summary h3{font-size:1rem;color:var(--bulb);margin-bottom:.3rem}
select[aria-invalid=true]{border-color:#ff8a7a}
.nav-row{display:flex;justify-content:space-between;gap:1rem;margin-top:2rem}
@media (max-width:560px){.progress li{font-size:0}.progress li::before{font-size:.85rem}}

/* ===== Refined, registration-focused look ===== */
.bulbs i{animation:none!important;opacity:.55;filter:drop-shadow(0 0 3px rgba(245,166,35,.6))}
.bulbs .b{opacity:0}
.bulbs{height:14px}
.top{padding:.75rem 1.5rem}
.top nav{gap:1.6rem}
.eyebrow{font-size:.8rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
h1{letter-spacing:-.02em}
.hero{padding-top:5rem;padding-bottom:3.5rem}
.hero-copy{gap:1.5rem}
.lead{font-size:1.2rem;color:var(--soft);max-width:34rem}
.cta-row{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.price-tag{color:var(--soft)}.price-tag b{font:800 1.6rem var(--serif);color:var(--bulb);margin-right:.3rem}
.status-card{background:var(--stage-2);border:1px solid var(--line);border-radius:18px;padding:1.75rem 2rem;box-shadow:0 24px 60px rgba(0,0,0,.35);max-width:360px;justify-self:end;width:100%}
.sc-title{font:600 1.3rem var(--serif);margin-bottom:1rem}
.status-card ul{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.status-card li{display:flex;align-items:center;gap:.8rem;padding-bottom:.9rem;border-bottom:1px solid var(--line)}
.status-card li:last-child{border:0;padding-bottom:0}
.status-card li::before{content:"✓";display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:rgba(127,214,164,.15);color:#7fd6a4;font-size:.8rem;flex:none}
.status-card li.go{color:var(--bulb);font-weight:700}
.status-card li.go::before{content:"→";background:rgba(245,166,35,.18);color:var(--gold)}
.sc-foot{margin-top:1.25rem;color:var(--soft);font-size:.9rem}
.trust{max-width:1080px;margin:0 auto;padding:1.25rem 1.5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;border-block:1px solid var(--line);text-align:center;color:var(--soft);font-weight:500;font-size:.95rem}
.steps4{list-style:none;counter-reset:s;margin:2.25rem 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.75rem}
.steps4 li{counter-increment:s;border-top:1px solid var(--line);padding-top:1.25rem}
.steps4 li::before{content:counter(s,decimal-leading-zero);font:600 1.6rem var(--serif);color:var(--gold)}
.steps4 h3{margin:.6rem 0 .4rem}.steps4 p{color:var(--soft);font-size:.98rem}
.need{background:var(--stage-2);max-width:none}
.need>*{max-width:1080px;margin-left:auto;margin-right:auto}
.need-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem}
.need-grid li{border:1px solid var(--line);border-radius:14px;padding:1.4rem}
.need-grid h3{font-size:1.1rem;margin-bottom:.4rem}.need-grid p{color:var(--soft);font-size:.96rem}
.faq{max-width:760px}
.faq h2{margin-bottom:1.5rem}
details{border-bottom:1px solid var(--line);padding:1.1rem 0}
summary{cursor:pointer;font:600 1.1rem var(--serif);list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::after{content:"+";color:var(--gold);font-size:1.4rem;line-height:1}
details[open] summary::after{content:"–"}
details p{color:var(--soft);margin-top:.7rem}
.cta-band{text-align:center;display:grid;gap:1.5rem;justify-items:center;padding-bottom:5rem}
@media (max-width:820px){
  .trust,.steps4{grid-template-columns:1fr 1fr}
  .status-card{justify-self:start}
  .hero{padding-top:3rem}
}
@media (max-width:480px){.trust,.steps4{grid-template-columns:1fr}}

/* ===== Round 3: navy theme, bigger logo, name choice, addresses, loader ===== */
.brand img{height:84px;width:auto;display:block}
.top{padding:.5rem 1.5rem}
@media (max-width:820px){.brand img{height:64px}}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.opt{display:flex;gap:.8rem;align-items:flex-start;border:2px solid var(--line);border-radius:14px;padding:1.1rem 1.2rem;cursor:pointer;background:var(--stage-2);transition:border-color .15s}
.opt:hover{border-color:#42588a}
.opt:has(input:checked){border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 0 24px rgba(245,166,35,.15)}
.opt input{accent-color:var(--gold);width:1.2rem;height:1.2rem;margin-top:.2rem;flex:none}
.opt b{display:block;font-weight:700}
.opt small{display:block;color:var(--soft);font-size:.9rem;margin-top:.15rem;font-weight:400}
.names{display:grid;gap:1rem}
.lbl{display:block;font-weight:500;margin-bottom:.35rem}
.addr{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.addr .full{grid-column:1/-1}
.addr-wrap{display:block}
@media (max-width:560px){.choice,.addr{grid-template-columns:1fr}}

/* Loading screen */
#loader{position:fixed;inset:0;z-index:100;display:grid;place-content:center;justify-items:center;gap:.8rem;text-align:center;padding:2rem;background:rgba(7,15,32,.96);backdrop-filter:blur(6px)}
.ld-ring{position:relative;width:200px;height:200px;margin-bottom:1rem}
.ld-ring img{position:absolute;inset:0;margin:auto;height:104px;width:auto;animation:pulse 2s ease-in-out infinite}
.ld-ring i{position:absolute;top:50%;left:50%;width:12px;height:12px;margin:-6px;border-radius:50%;background:var(--bulb);box-shadow:0 0 10px var(--gold);opacity:.35;animation:chase 1.2s linear infinite}
.ld-ring i:nth-child(1){transform:rotate(0deg) translateY(-92px);animation-delay:-1.2s}
.ld-ring i:nth-child(2){transform:rotate(30deg) translateY(-92px);animation-delay:-1.1s}
.ld-ring i:nth-child(3){transform:rotate(60deg) translateY(-92px);animation-delay:-1.0s}
.ld-ring i:nth-child(4){transform:rotate(90deg) translateY(-92px);animation-delay:-0.9s}
.ld-ring i:nth-child(5){transform:rotate(120deg) translateY(-92px);animation-delay:-0.8s}
.ld-ring i:nth-child(6){transform:rotate(150deg) translateY(-92px);animation-delay:-0.7s}
.ld-ring i:nth-child(7){transform:rotate(180deg) translateY(-92px);animation-delay:-0.6s}
.ld-ring i:nth-child(8){transform:rotate(210deg) translateY(-92px);animation-delay:-0.5s}
.ld-ring i:nth-child(9){transform:rotate(240deg) translateY(-92px);animation-delay:-0.4s}
.ld-ring i:nth-child(10){transform:rotate(270deg) translateY(-92px);animation-delay:-0.3s}
.ld-ring i:nth-child(11){transform:rotate(300deg) translateY(-92px);animation-delay:-0.2s}
.ld-ring i:nth-child(12){transform:rotate(330deg) translateY(-92px);animation-delay:-0.1s}
@keyframes chase{0%{opacity:1;box-shadow:0 0 16px var(--bulb)}60%,100%{opacity:.2}}
@keyframes pulse{50%{transform:scale(1.06);filter:drop-shadow(0 0 14px rgba(245,166,35,.55))}}
.ld-msg{font:600 1.5rem var(--serif);max-width:24rem}
.ld-sub{color:var(--soft)}
.ld-lock{color:var(--bulb);font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;margin-top:.5rem}

/* ===== Trust, legal, autosave, WhatsApp ===== */
footer a{color:var(--soft);text-decoration:underline}footer p+p{margin-top:.4rem}
.wa-float{position:fixed;right:16px;bottom:16px;z-index:50;background:#25d366;color:#06301a;font-weight:700;padding:.7rem 1.1rem;border-radius:999px;text-decoration:none;box-shadow:0 4px 16px rgba(0,0,0,.35)}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:1000px;margin:3rem auto;padding:0 1.5rem}
.trust div{border:1px solid var(--line);border-radius:14px;padding:1.2rem 1.3rem;background:var(--stage-2)}
.trust b{display:block;margin-bottom:.35rem}.trust p{color:var(--soft);font-size:.95rem}.trust a{color:var(--bulb)}
@media (max-width:700px){.trust{grid-template-columns:1fr}}
.secure{background:var(--stage-2);border:1px solid var(--line);border-radius:10px;padding:.8rem 1rem;color:var(--soft);font-size:.95rem}.secure a{color:var(--bulb)}
.restored{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--stage-2);border:1px solid var(--gold);border-radius:12px;padding:.8rem 1rem;margin-bottom:1rem}
.legal{max-width:760px;margin:2rem auto 3rem;padding:0 1.25rem;line-height:1.7}
.legal h1,.legal h2{font-family:var(--serif);margin:1.6rem 0 .5rem}.legal h1{font-size:2.2rem;margin-top:.5rem}.legal h2{font-size:1.3rem}
.legal a{color:var(--bulb)}.legal .soft{color:var(--soft)}
