*{box-sizing:border-box}:root{--teal:#0f7772;--teal2:#075f5b;--red:#8f0710;--red2:#640008;--ink:#122126;--muted:#657277}body{margin:0;min-height:100vh;overflow-x:hidden;font-family:Cairo,system-ui,sans-serif;color:var(--ink);background:radial-gradient(circle at 10% 15%,rgba(15,119,114,.15),transparent 28%),radial-gradient(circle at 90% 85%,rgba(143,7,16,.13),transparent 30%),linear-gradient(135deg,#fff,#f8f3ef 50%,#edf7f5)}.grid{position:fixed;inset:0;pointer-events:none;opacity:.35;background-image:linear-gradient(rgba(15,119,114,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(15,119,114,.05) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(#000,transparent 95%)}main{width:min(1180px,calc(100% - 36px));min-height:100vh;margin:auto;display:flex;flex-direction:column;justify-content:space-between}.hero{min-height:calc(100vh - 92px);display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:70px;padding:54px 0 34px}.copy{position:relative;z-index:3;animation:up .8s ease both}.pill{display:inline-flex;padding:8px 15px;border-radius:999px;border:1px solid rgba(15,119,114,.23);background:rgba(15,119,114,.08);color:var(--teal2);font-size:.82rem;font-weight:800}h1{margin:22px 0 16px;font-size:clamp(2rem,4.8vw,4.4rem);line-height:1.17;letter-spacing:-.035em;color:var(--red);font-weight:900}h1 span{display:block;margin-top:14px;font-size:clamp(1rem,1.55vw,1.3rem);color:var(--teal2);font-weight:700;letter-spacing:0}.copy>p{max-width:700px;margin:0;color:var(--muted);line-height:2;font-size:clamp(.96rem,1.25vw,1.08rem)}.progress{width:min(540px,100%);margin-top:25px;padding:18px;border-radius:20px;border:1px solid rgba(15,119,114,.16);background:rgba(255,255,255,.72);box-shadow:0 16px 38px rgba(16,32,37,.08);backdrop-filter:blur(10px)}.progress-top{display:flex;justify-content:space-between;margin-bottom:11px;font-size:.88rem;font-weight:700}.progress-top strong{color:var(--red)}.track{height:12px;border-radius:999px;overflow:hidden;background:#e9dedc}.fill{width:78%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--red),var(--teal));position:relative;animation:grow 2s ease-in-out infinite alternate}.fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:shine 1.8s linear infinite}.progress small{display:block;margin-top:11px;color:var(--muted);font-size:.76rem}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:25px}.btn{min-height:55px;padding:0 22px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:800;transition:.25s}.btn:hover{transform:translateY(-3px)}.primary{color:#fff;background:linear-gradient(135deg,var(--red),var(--red2));box-shadow:0 16px 34px rgba(143,7,16,.22)}.secondary{color:var(--teal2);border:1px solid rgba(15,119,114,.32);background:rgba(15,119,114,.08)}.contacts{width:max-content;max-width:100%;display:flex;align-items:center;gap:18px;margin-top:20px;padding:14px 17px;border:1px solid rgba(15,119,114,.14);border-radius:18px;background:rgba(255,255,255,.62)}.contacts a{display:grid;gap:2px;text-decoration:none;color:var(--ink)}.contacts span{font-size:.72rem;color:var(--muted)}.contacts b{font-size:.87rem}.contacts i{width:1px;height:36px;background:rgba(16,32,37,.13)}.visual{min-height:560px;position:relative;display:grid;place-items:center;animation:up .9s .1s ease both}.logo{position:relative;z-index:4;width:min(390px,68vw);aspect-ratio:1;padding:20px;border-radius:44px;background:rgba(255,255,255,.86);border:1px solid rgba(15,119,114,.15);box-shadow:0 34px 75px rgba(16,32,37,.16);animation:float 4.8s ease-in-out infinite}.logo img{width:100%;height:100%;object-fit:contain;border-radius:28px}.ring{position:absolute;border-radius:50%;border:1px solid rgba(15,119,114,.2)}.r1{width:500px;height:500px;animation:spin 18s linear infinite}.r2{width:450px;height:280px;border-color:rgba(143,7,16,.2);transform:rotate(28deg);animation:breathe 5s ease-in-out infinite}.status{position:absolute;z-index:5;left:8%;bottom:18%;padding:10px 15px;border-radius:999px;background:#fff;box-shadow:0 12px 30px rgba(16,32,37,.12);color:var(--teal2);font-weight:800}.status span{display:inline-block;width:9px;height:9px;border-radius:50%;margin-left:8px;background:#19ae72;animation:pulse 1.8s infinite}footer{min-height:92px;padding:22px 0 26px;display:flex;justify-content:space-between;align-items:center;gap:18px;border-top:1px solid rgba(16,32,37,.1);color:var(--muted);font-size:.78rem}footer p{margin:0}footer a{color:var(--red);font-weight:800;text-decoration:none}@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-16px) rotate(1deg)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{0%,100%{opacity:.5;transform:rotate(28deg) scale(.97)}50%{opacity:1;transform:rotate(28deg) scale(1.04)}}@keyframes grow{from{width:72%}to{width:80%}}@keyframes shine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes pulse{70%{box-shadow:0 0 0 11px rgba(25,174,114,0)}100%{box-shadow:0 0 0 0 rgba(25,174,114,0)}}@media(max-width:930px){.hero{grid-template-columns:1fr;gap:8px;padding-top:28px}.visual{min-height:430px;order:-1}.copy{text-align:center}.copy>p,.progress,.contacts{margin-inline:auto}.actions{justify-content:center}.r1{width:400px;height:400px}.r2{width:370px;height:230px}}@media(max-width:560px){main{width:min(100% - 24px,1180px)}.visual{min-height:345px}.logo{width:245px;padding:13px;border-radius:30px}.r1{width:300px;height:300px}.r2{width:285px;height:170px}.status{left:0;bottom:16%}.actions{display:grid}.btn{width:100%}.contacts{width:100%;flex-direction:column;text-align:center}.contacts i{width:100%;height:1px}footer{flex-direction:column;text-align:center;justify-content:center}}


/* Dark theme update */
:root{
  --cream:#07110f;
  --ink:#f4f8f7;
  --muted:#a7b8b5;
}

body{
  color:var(--ink);
  background:
    radial-gradient(circle at 12% 12%,rgba(15,119,114,.22),transparent 30%),
    radial-gradient(circle at 88% 82%,rgba(143,7,16,.2),transparent 34%),
    linear-gradient(135deg,#040807 0%,#07110f 48%,#0b1715 100%);
}

.bg-pattern{
  opacity:.2;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
}

.brand-pill{
  border-color:rgba(56,180,171,.28);
  background:rgba(15,119,114,.16);
  color:#7ad8d0;
}

h1{
  color:#ffffff;
}

h1 span{
  color:#72d2ca;
}

.lead,
.progress-card small,
.contact-row span,
footer{
  color:#a7b8b5;
}

.progress-card,
.contact-row{
  border-color:rgba(255,255,255,.1);
  background:rgba(255,255,255,.055);
  box-shadow:0 18px 45px rgba(0,0,0,.28);
  backdrop-filter:blur(12px);
}

.progress-top span,
.contact-row a,
.contact-row strong{
  color:#f4f8f7;
}

.progress-track{
  background:rgba(255,255,255,.12);
}

.btn-outline{
  color:#87e0d8;
  border-color:rgba(70,199,188,.3);
  background:rgba(15,119,114,.13);
}

.logo-frame{
  background:rgba(255,255,255,.94);
  border-color:rgba(255,255,255,.12);
  box-shadow:
    0 36px 80px rgba(0,0,0,.46),
    inset 0 0 0 1px rgba(255,255,255,.7);
}

.status-chip{
  background:#101b19;
  color:#82ded6;
  border-color:rgba(255,255,255,.1);
  box-shadow:0 14px 34px rgba(0,0,0,.35);
}

.orbit-one{
  border-color:rgba(93,219,207,.22);
}

.orbit-two{
  border-color:rgba(222,71,83,.22);
}

footer{
  border-top-color:rgba(255,255,255,.08);
}

footer a{
  color:#7ad8d0;
}


/* Dark contact and text fixes */
body {
  background:
    radial-gradient(circle at 12% 12%,rgba(15,119,114,.22),transparent 30%),
    radial-gradient(circle at 88% 82%,rgba(143,7,16,.2),transparent 34%),
    linear-gradient(135deg,#030706 0%,#07110f 50%,#091513 100%);
  color:#f4f8f7;
}

.progress-card,
.contact-row {
  background:rgba(8,16,15,.78) !important;
  border-color:rgba(255,255,255,.12) !important;
}

.progress-top span,
.contact-row a,
.contact-row strong {
  color:#ffffff !important;
}

.contact-row a:hover {
  color:#7ad8d0 !important;
}

.contact-row span,
.progress-card small,
.lead {
  color:#b8c7c4 !important;
}

.contact-row i {
  background:rgba(255,255,255,.18);
}

.status-chip {
  background:#07110f !important;
  color:#7ad8d0 !important;
}

.logo-frame {
  background:#ffffff !important;
}

footer {
  color:#b8c7c4 !important;
}

footer a {
  color:#7ad8d0 !important;
}

.btn-outline {
  color:#8ce5dd !important;
}

.brand-pill {
  color:#8ce5dd !important;
}


/* Final dark cleanup */
.progress-card {
  display:none !important;
}

.contact-row,
.progress-card {
  background:rgba(10,18,17,.92) !important;
  border-color:rgba(255,255,255,.12) !important;
}

.contact-row a,
.contact-row strong,
.contact-row span {
  color:#ffffff !important;
}

.contact-row span {
  color:#9fb2af !important;
}

.contact-row i {
  background:rgba(255,255,255,.2) !important;
}

.status-chip {
  background:#07110f !important;
  color:#7ad8d0 !important;
}

.logo-frame {
  background:#ffffff !important;
}

/* Cleaner logo animation without stars */
.spark,
.badge {
  display:none !important;
}

.orbit-one {
  animation:spin 22s linear infinite;
  opacity:.45;
}

.orbit-two {
  animation:breathe 6s ease-in-out infinite;
  opacity:.35;
}

footer,
footer p {
  color:#b7c7c4 !important;
}

footer a {
  color:#72d2ca !important;
}


/* Transparent progress design */
.progress {
  width:min(540px,100%);
  margin-top:25px;
  padding:18px;
  background-color:transparent !important;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
}

.progress-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
}

.progress-top span {
  color:#ffffff;
  font-weight:700;
}

.progress-top strong {
  color:#ef1524;
}

.track {
  height:12px;
  width:100%;
  background:rgba(255,255,255,.16);
  border-radius:999px;
  overflow:hidden;
}

.fill {
  width:78%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#8f0710,#0f7772);
  animation:progressMove 2s ease-in-out infinite alternate;
}

.progress small {
  display:block;
  margin-top:12px;
  color:#aebdbb;
}

@keyframes progressMove {
  from {width:72%}
  to {width:78%}
}


/* Transparent contacts block */
.contacts {
  width:max-content;
  max-width:100%;
  margin-top:20px;
  padding:14px 17px;
  display:flex;
  align-items:center;
  gap:18px;
  background:transparent !important;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
}

.contacts a {
  display:grid;
  gap:3px;
  text-decoration:none;
}

.contacts span {
  color:#aebdbb;
  font-size:.72rem;
}

.contacts b {
  color:#ffffff;
  font-size:.88rem;
  font-weight:800;
}

.contacts i {
  width:1px;
  height:36px;
  background:rgba(255,255,255,.18);
}

.contacts a:hover b {
  color:#72d2ca;
}

@media(max-width:560px){
  .contacts {
    width:100%;
    flex-direction:column;
    text-align:center;
  }

  .contacts i {
    width:100%;
    height:1px;
  }
}

.contact-row { 
  background: transparent !important;
}
