:root{
  --bg: #12161a; --bg-alt: #171c21; --surface: #1d242b; --surface-2: #232b33;
  --border: #2b343d; --text: #e7ebee; --text-dim: #8b98a3;
  --mint: #4ddba0; --mint-dim: #2c6b52; --amber: #f2a33d;
  --paper: #ece3ce; --paper-ink: #2a2420; --paper-line: #c9bd9d; --danger-stamp: #b5473a;
  --danger: #e05a4e;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg); color:var(--text); font-family:'Inter', sans-serif; line-height:1.5; -webkit-font-smoothing:antialiased;}
.mono{font-family:'IBM Plex Mono', monospace;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
img{max-width:100%; display:block;}
section{padding:96px 24px;}
.wrap{max-width:1180px; margin:0 auto;}
.eyebrow{font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--mint); display:flex; align-items:center; gap:10px; margin-bottom:18px;}
.eyebrow::before{content:""; width:18px; height:1px; background:var(--mint);}
h1,h2,h3{font-family:'IBM Plex Mono', monospace; font-weight:600; letter-spacing:-.01em;}
h2{font-size:clamp(28px,4vw,40px); color:var(--text);}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 26px; font-family:'IBM Plex Mono', monospace; font-size:14px; font-weight:600; border-radius:3px; cursor:pointer; border:1px solid transparent; transition:transform .15s ease, background .2s ease, border-color .2s ease; white-space:nowrap;}
.btn:focus-visible{outline:2px solid var(--mint); outline-offset:3px;}
.btn-primary{background:var(--amber); color:#1a1206;}
.btn-primary:hover{transform:translateY(-2px);}
.btn-ghost{background:transparent; color:var(--text); border-color:var(--border);}
.btn-ghost:hover{border-color:var(--mint); color:var(--mint);}

header.site-header{position:sticky; top:0; z-index:50; background:rgba(18,22,26,.86); backdrop-filter:blur(10px); border-bottom:1px solid var(--border);}
.nav{max-width:1180px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between;}
.logo{font-family:'IBM Plex Mono', monospace; font-weight:700; font-size:16px; display:flex; align-items:center; gap:10px;}
.logo .dot{width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 0 3px rgba(77,219,160,.18);}
.logo img{height:32px; width:auto; display:block;}
.nav-links{display:flex; align-items:center; gap:26px;}
.nav-links a{font-size:14.5px; color:var(--text-dim); transition:color .2s;}
.nav-links a:hover, .nav-links a.active{color:var(--text);}
.status-pill{display:flex; align-items:center; gap:8px; font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--text-dim); border:1px solid var(--border); padding:6px 12px; border-radius:99px;}
.status-pill .pulse{width:7px; height:7px; border-radius:50%; background:var(--mint); animation:pulse 2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(77,219,160,.5);} 70%{box-shadow:0 0 0 7px rgba(77,219,160,0);} 100%{box-shadow:0 0 0 0 rgba(77,219,160,0);}}
.nav-cta{display:flex; align-items:center; gap:18px;}

.page-header{padding:64px 24px 30px; max-width:1180px; margin:0 auto;}
.page-header h1{font-size:clamp(28px,4vw,42px);}

.hero{padding:76px 24px 60px; display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; max-width:1180px; margin:0 auto;}
.hero h1{font-size:clamp(32px,4.6vw,54px); line-height:1.12; color:var(--text); margin-bottom:22px;}
.hero h1 span{color:var(--mint);}
.hero p{color:var(--text-dim); font-size:17px; max-width:480px; margin-bottom:34px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:38px;}
.trust-row{display:flex; gap:10px; flex-wrap:wrap;}
.trust-tag{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--text-dim); border:1px solid var(--border); padding:7px 12px; border-radius:99px; display:flex; align-items:center; gap:7px;}
.trust-tag::before{content:"✓"; color:var(--mint);}

.ticket-wrap{display:flex; justify-content:center; align-items:center;}
.ticket{background:var(--paper); color:var(--paper-ink); width:100%; max-width:340px; border-radius:6px; padding:26px 24px 30px; position:relative; transform:rotate(2.2deg); box-shadow:0 30px 60px -20px rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.05); font-family:'IBM Plex Mono', monospace;}
.ticket::before, .ticket::after{content:""; position:absolute; left:50%; transform:translateX(-50%); width:26px; height:13px; background:var(--bg); border-radius:0 0 13px 13px;}
.ticket::before{top:-1px;}
.ticket::after{bottom:-1px; border-radius:13px 13px 0 0;}
.ticket-row{display:flex; justify-content:space-between; font-size:11.5px; color:#6b6252; letter-spacing:.04em; text-transform:uppercase;}
.ticket-num{font-size:20px; font-weight:700; margin:8px 0 18px; letter-spacing:.02em;}
.ticket-line{border-top:1px dashed var(--paper-line); margin:16px 0;}
.ticket-field{display:flex; justify-content:space-between; font-size:13px; margin-bottom:9px;}
.ticket-field b{font-weight:600;}
.stamp{margin-top:20px; display:inline-block; border:2.5px solid var(--mint-dim); color:#1f6b4c; font-weight:700; font-size:15px; letter-spacing:.06em; padding:8px 14px; border-radius:5px; transform:rotate(-6deg) scale(1); opacity:.92;}

.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center;}
.about-grid p{color:var(--text-dim); font-size:16px; line-height:1.7; white-space:pre-line;}

.services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:44px;}
.service-card{background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:26px; transition:border-color .2s, transform .2s;}
.service-card:hover{border-color:var(--mint-dim); transform:translateY(-3px);}
.service-code{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--mint); margin-bottom:14px;}
.service-card h3{font-size:17px; font-weight:600; margin-bottom:10px; font-family:'Inter',sans-serif;}
.service-card p{color:var(--text-dim); font-size:14.5px;}

.process{margin-top:50px; display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--border);}
.process-step{padding:30px 22px; border-right:1px solid var(--border); position:relative;}
.process-step:last-child{border-right:none;}
.process-num{font-family:'IBM Plex Mono', monospace; color:var(--mint-dim); font-size:13px; margin-bottom:14px;}
.process-step h3{font-size:16.5px; margin-bottom:8px; font-family:'Inter', sans-serif; font-weight:600;}
.process-step p{font-size:14px; color:var(--text-dim);}

.ref-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px;}
.ref-ticket{background:var(--paper); color:var(--paper-ink); border-radius:6px; padding:22px 20px; position:relative; font-family:'IBM Plex Mono', monospace;}
.ref-top{display:flex; justify-content:space-between; align-items:flex-start; font-size:11.5px; color:#6b6252; text-transform:uppercase; letter-spacing:.04em;}
.ref-stamp{border:2px solid var(--danger-stamp); color:var(--danger-stamp); font-size:10.5px; font-weight:700; padding:3px 7px; border-radius:3px; transform:rotate(-4deg); opacity:.85;}
.ref-device{font-size:14.5px; font-weight:700; margin:12px 0 10px;}
.ref-quote{font-family:'Inter', sans-serif; font-size:14px; color:#3a332b; line-height:1.5; margin-bottom:14px;}
.ref-name{font-size:12px; color:#6b6252;}

.contact-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:50px; margin-top:44px;}
.info-card{background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:28px;}
.info-row{display:flex; gap:14px; margin-bottom:22px;}
.info-row .k{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--mint); min-width:80px; text-transform:uppercase; letter-spacing:.05em; padding-top:2px;}
.info-row .v{font-size:14.5px; color:var(--text);}

form.site-form{background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:30px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
.field{display:flex; flex-direction:column; gap:7px;}
.field.full{grid-column:1/-1;}
label{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.04em;}
input, select, textarea{background:var(--bg-alt); border:1px solid var(--border); border-radius:5px; padding:11px 13px; color:var(--text); font-family:'Inter', sans-serif; font-size:14.5px; width:100%;}
input:focus, select:focus, textarea:focus{outline:2px solid var(--mint); outline-offset:1px; border-color:var(--mint);}
textarea{resize:vertical; min-height:90px;}
.form-note{font-size:12.5px; color:var(--text-dim); margin-top:14px;}

footer.site-footer{border-top:1px solid var(--border); padding:40px 24px;}
.footer-wrap{max-width:1180px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
.footer-wrap p{color:var(--text-dim); font-size:13px;}
.footer-admin{color:var(--text-dim); font-size:12px; opacity:.55; transition:opacity .2s;}
.footer-admin:hover{opacity:1; color:var(--mint);}
.footer-logo{display:flex; align-items:center; gap:10px;}
.footer-logo img{height:26px; width:auto;}

.float-actions{position:fixed; bottom:22px; right:22px; display:flex; flex-direction:column; gap:12px; z-index:70;}
.float-btn{width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 25px -8px rgba(0,0,0,.6); transition:transform .15s ease; color:#fff;}
.float-btn:hover{transform:translateY(-3px) scale(1.06);}
.float-btn:focus-visible{outline:2px solid var(--mint); outline-offset:3px;}
.float-whatsapp{background:#22c55e;}
.float-call{background:var(--amber); color:#1a1206;}
.float-btn svg{width:24px; height:24px;}

/* ---- admin-only ---- */
#gate{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;}
.gate-card{background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:36px; width:100%; max-width:360px;}
.gate-card h1{font-family:'IBM Plex Mono', monospace; font-size:18px; margin-bottom:6px;}
.gate-card p{color:var(--text-dim); font-size:13.5px; margin-bottom:20px;}
.gate-error{color:var(--danger); font-size:13px; margin-bottom:14px;}
.gate-ok{color:var(--mint); font-size:13px; margin-bottom:14px;}

#panel{max-width:920px; margin:0 auto; padding:40px 24px 60px;}
.top{display:flex; justify-content:space-between; align-items:center; margin-bottom:36px; flex-wrap:wrap; gap:14px;}
.top h1{font-family:'IBM Plex Mono', monospace; font-size:20px;}
.top .actions{display:flex; gap:10px; flex-wrap:wrap;}
.btn-small{padding:6px 12px; font-size:12px;}
.btn-danger{border-color:var(--danger); color:var(--danger); background:transparent;}
.btn-danger:hover{background:var(--danger); color:#fff;}

.card{background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:26px; margin-bottom:22px;}
.card h2{font-family:'IBM Plex Mono', monospace; font-size:14px; color:var(--mint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:20px;}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.hint{color:var(--text-dim); font-size:12px; margin-top:-8px; margin-bottom:16px;}

.upload-box{border:1px dashed var(--border); border-radius:8px; padding:16px; display:flex; align-items:center; gap:14px;}
.upload-box img{height:44px; width:auto; max-width:100px; object-fit:contain; background:#fff; border-radius:4px; padding:4px;}
.upload-box .empty{height:44px; width:70px; display:flex; align-items:center; justify-content:center; font-size:11px; color:var(--text-dim); border:1px dashed var(--border); border-radius:4px;}
.upload-box .controls{display:flex; flex-direction:column; gap:8px; flex:1;}
.upload-box input[type=file]{font-size:12.5px; color:var(--text-dim);}

.repeat-item{border:1px solid var(--border); border-radius:6px; padding:18px; margin-bottom:14px; position:relative;}
.repeat-item .remove{position:absolute; top:10px; right:10px;}

.save-bar{position:sticky; bottom:0; background:rgba(18,22,26,.94); backdrop-filter:blur(8px); border-top:1px solid var(--border); padding:16px 24px; display:flex; justify-content:center; align-items:center; gap:12px; margin:0 -24px -60px;}

@media (prefers-reduced-motion: reduce){*{animation:none !important; transition:none !important;}}

@media (max-width:920px){
  .hero{grid-template-columns:1fr; padding-top:50px;}
  .ticket-wrap{order:-1; margin-bottom:10px;}
  .ticket{transform:rotate(1deg); max-width:300px;}
  .about-grid{grid-template-columns:1fr;}
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .process{grid-template-columns:repeat(2,1fr);}
  .process-step:nth-child(2){border-right:none;}
  .process-step{border-bottom:1px solid var(--border);}
  .ref-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .nav-links{display:none;}
}
@media (max-width:560px){
  .services-grid{grid-template-columns:1fr;}
  .process{grid-template-columns:1fr;}
  .process-step{border-right:none;}
  .form-row{grid-template-columns:1fr;}
  section{padding:64px 18px;}
  .float-actions{bottom:16px; right:16px;}
  .float-btn{width:48px; height:48px;}
}