/* ===================================================================
   Stelele Informaticii — shared stylesheet
   =================================================================== */

:root{
  --void:#0B0F1A;
  --space:#121A2E;
  --space-light:#1B2740;
  --star-gold:#F5C451;
  --phosphor:#7CFFC4;
  --text:#E9ECF5;
  --muted:#8B93AC;
  --line: rgba(233,236,245,0.09);
  --font-display:'JetBrains Mono', monospace;
  --font-body:'Manrope', sans-serif;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--void);
  color:var(--text);
  font-family:var(--font-body);
  line-height:1.6;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
::selection{background:var(--phosphor); color:var(--void);}
:focus-visible{outline:2px solid var(--phosphor); outline-offset:3px;}
img{max-width:100%; display:block;}

.container{max-width:1140px; margin:0 auto; padding:0 28px;}

/* ---------- NAV ---------- */
header.site-header{
  position:fixed; top:0; left:0; right:0; z-index:50;
  backdrop-filter:blur(10px);
  background:rgba(11,15,26,0.65);
  border-bottom:1px solid var(--line);
}
nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; max-width:1140px; margin:0 auto;
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:700; font-size:14px; letter-spacing:0.02em;
  white-space:nowrap;
}
.brand .glyph{width:20px; height:20px; display:inline-block; flex-shrink:0;}
.brand .glyph svg{width:100%; height:100%;}
.navlinks{
  display:flex; gap:24px; font-size:12.5px; font-family:var(--font-display);
  letter-spacing:0.03em; text-transform:uppercase;
}
.navlinks a{color:var(--muted); position:relative; padding:4px 0; transition:color .2s ease; white-space:nowrap;}
.navlinks a:hover, .navlinks a.active{color:var(--phosphor);}
.navlinks a::after{
  content:''; position:absolute; left:0; bottom:-2px; width:0; height:1px;
  background:var(--phosphor); transition:width .25s ease;
}
.navlinks a:hover::after, .navlinks a.active::after{width:100%;}
.navtoggle{display:none; background:none; border:none; color:var(--text); font-size:22px; cursor:pointer;}

@media (max-width: 900px){
  .navlinks{
    position:fixed; top:65px; left:0; right:0;
    background:var(--space); border-bottom:1px solid var(--line);
    display:grid; grid-template-columns:1fr 1fr; gap:0;
    padding:6px 0 10px;
    max-height:calc(100vh - 65px);
    overflow-y:auto;
    box-shadow:0 20px 40px rgba(0,0,0,0.35);
    opacity:0; visibility:hidden; transform:translateY(-8px);
    transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
  }
  .navlinks.open{opacity:1; visibility:visible; transform:translateY(0);}
  .navlinks a{
    padding:13px 20px; width:100%;
    border-bottom:1px solid var(--line);
  }
  .navlinks a::after{display:none;}
  .navtoggle{display:block;}
}
@media (max-width: 420px){
  .navlinks{grid-template-columns:1fr;}
}

/* ---------- STARFIELD ---------- */
#starfield{position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0;}

/* ---------- HERO (home) ---------- */
.hero{
  position:relative; min-height:100vh; display:flex; flex-direction:column;
  justify-content:center; padding-top:90px; overflow:hidden;
}
.hero::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 900px 650px at 8% 42%, rgba(11,15,26,0.72), transparent 68%),
             radial-gradient(ellipse at 50% 30%, rgba(124,255,196,0.05), transparent 60%),
             linear-gradient(180deg, transparent 0%, var(--void) 96%);
  pointer-events:none;
}
.hero-inner{position:relative; z-index:2; max-width:1140px; margin:0 auto; padding:0 28px; width:100%;}

/* ---------- PAGE HERO (subpages) ---------- */
.page-hero{
  position:relative; min-height:44vh; display:flex; flex-direction:column;
  justify-content:center; padding-top:90px; overflow:hidden; border-bottom:1px solid var(--line);
}
.page-hero::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 0%, rgba(124,255,196,0.07), transparent 60%),
             linear-gradient(180deg, transparent 0%, var(--void) 96%);
  pointer-events:none;
}
.page-hero-inner{position:relative; z-index:2; max-width:1140px; margin:0 auto; padding:60px 28px; width:100%;}
.page-hero h1{
  font-family:var(--font-display); font-weight:700; font-size:clamp(32px, 6vw, 56px);
  letter-spacing:-0.01em; margin-bottom:14px;
  background:linear-gradient(180deg, #fff 0%, var(--phosphor) 150%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.page-hero p.lede{color:var(--muted); font-size:17px; max-width:560px;}

.eyebrow{
  font-family:var(--font-display); color:var(--phosphor); font-size:13px; letter-spacing:0.15em;
  text-transform:uppercase; display:flex; align-items:center; gap:10px; margin-bottom:20px;
}
.eyebrow .dot{
  width:7px; height:7px; background:var(--phosphor); border-radius:50%;
  box-shadow:0 0 8px var(--phosphor); animation:pulse 1.8s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1;} 50%{opacity:.35;}}

h1.title{
  font-family:var(--font-display); font-weight:700; font-size:clamp(42px, 8vw, 92px);
  line-height:1.02; letter-spacing:-0.01em;
  background:linear-gradient(180deg, #fff 0%, var(--phosphor) 130%);
  -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:22px;
  text-shadow:0 4px 30px rgba(0,0,0,0.45);
}
.subhead{font-size:clamp(17px, 2.2vw, 21px); color:var(--muted); max-width:560px; margin-bottom:36px; font-weight:500; text-shadow:0 2px 16px rgba(11,15,26,0.9);}
.datestamp{
  display:inline-flex; align-items:center; gap:14px; font-family:var(--font-display);
  font-size:clamp(24px, 4vw, 40px); font-weight:700; color:var(--star-gold); margin-bottom:36px; letter-spacing:0.02em;
}
.datestamp .cursor{display:inline-block; width:0.5ch; height:1em; background:var(--star-gold); animation:blink 1s steps(1) infinite;}
@keyframes blink{50%{opacity:0;}}

.cta-row{display:flex; gap:18px; flex-wrap:wrap;}
.btn{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--font-display); font-size:13px;
  letter-spacing:0.06em; text-transform:uppercase; padding:15px 26px; border-radius:3px;
  transition:all .2s ease; cursor:pointer; border:1px solid transparent;
}
.btn-primary{background:var(--phosphor); color:var(--void) !important; font-weight:700;}
.btn-primary:hover{background:#98ffd2; transform:translateY(-1px);}
.btn-ghost{border:1px solid var(--line); color:var(--text);}
.btn-ghost:hover{border-color:var(--phosphor); color:var(--phosphor);}
.btn-small{padding:10px 18px; font-size:11.5px;}

/* ---------- SECTION GENERIC ---------- */
section{position:relative; padding:100px 0;}
section.tight{padding:60px 0;}
.section-label{
  font-family:var(--font-display); color:var(--phosphor); font-size:13px; letter-spacing:0.15em;
  text-transform:uppercase; margin-bottom:14px; display:block;
}
h2.section-title{
  font-family:var(--font-display); font-weight:700; font-size:clamp(28px, 4vw, 44px);
  letter-spacing:-0.01em; margin-bottom:20px; max-width:640px;
}
.section-intro{color:var(--muted); font-size:17px; max-width:640px; margin-bottom:50px;}

/* ---------- CONSTELLATION FEATURES (home) ---------- */
.constellation{position:relative;}
.constellation-svg{position:absolute; top:60px; left:0; width:100%; height:calc(100% - 120px); z-index:0; pointer-events:none;}
.constellation-svg path{fill:none; stroke:var(--line); stroke-width:1; stroke-dasharray:4 6;}
.constellation-svg circle{fill:var(--star-gold); opacity:.5;}
.feature-grid{position:relative; z-index:1; display:grid; grid-template-columns:repeat(3, 1fr); gap:32px;}
@media (max-width:900px){.feature-grid{grid-template-columns:1fr; gap:20px;} .constellation-svg{display:none;}}
.feature-card{
  background:linear-gradient(160deg, var(--space), var(--space-light)); border:1px solid var(--line);
  border-radius:6px; padding:34px 28px; transition:transform .25s ease, border-color .25s ease;
}
.feature-card:hover{transform:translateY(-6px); border-color:rgba(124,255,196,0.35);}
.feature-node{
  width:34px; height:34px; border-radius:50%; background:var(--void); border:1px solid var(--star-gold);
  display:flex; align-items:center; justify-content:center; margin-bottom:22px; position:relative;
}
.feature-node::before{content:''; position:absolute; inset:-6px; border:1px solid rgba(245,196,81,0.25); border-radius:50%;}
.feature-node svg{width:16px; height:16px; stroke:var(--star-gold);}
.feature-card h3{font-family:var(--font-display); font-size:18px; margin-bottom:10px; font-weight:600;}
.feature-card p{color:var(--muted); font-size:15px;}

/* ---------- DATES / LOG ---------- */
.dates-section{background:var(--space); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.log-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:6px; overflow:hidden;
}
@media (max-width:780px){.log-grid{grid-template-columns:1fr;}}
.log-entry{background:var(--void); padding:36px 34px;}
.log-entry .tag{font-family:var(--font-display); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--phosphor); display:block; margin-bottom:14px;}
.log-entry h3{font-family:var(--font-display); font-size:22px; margin-bottom:12px;}
.log-entry p{color:var(--muted); font-size:15px;}
.log-entry p a{color:var(--star-gold); border-bottom:1px solid rgba(245,196,81,0.4);}
.log-entry .value{font-family:var(--font-display); font-weight:700; color:var(--text);}

/* ---------- MISSION ---------- */
.mission-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:32px; margin-top:50px;}
@media (max-width:900px){.mission-grid{grid-template-columns:1fr;}}
.mission-card{border-top:1px solid var(--line); padding-top:24px;}
.mission-card .num{font-family:var(--font-display); color:var(--star-gold); font-size:13px; display:block; margin-bottom:14px;}
.mission-card h3{font-family:var(--font-display); font-size:18px; margin-bottom:10px; font-weight:600;}
.mission-card p{color:var(--muted); font-size:15px;}

/* ---------- CTA ---------- */
.cta-section{text-align:center; position:relative;}
.cta-section h2{font-family:var(--font-display); font-size:clamp(28px, 5vw, 46px); max-width:700px; margin:0 auto 20px; font-weight:700;}
.cta-section p{color:var(--muted); max-width:600px; margin:0 auto 40px; font-size:17px;}

/* ---------- PROSE (rules / registration text) ---------- */
.prose-block{max-width:760px;}
.prose-block + .prose-block{margin-top:56px; padding-top:44px; border-top:1px solid var(--line);}
.prose-block h2{
  font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--phosphor);
  margin-bottom:16px; letter-spacing:0.01em;
}
.prose-block p{color:var(--muted); font-size:15.5px; margin-bottom:14px;}
.prose-block p:last-child{margin-bottom:0;}
.prose-block a{color:var(--star-gold); border-bottom:1px solid rgba(245,196,81,0.4);}
.prose-block ul{color:var(--muted); font-size:15.5px; padding-left:20px; margin-bottom:14px;}
.prose-block ul li{margin-bottom:6px;}
.prose-block strong{color:var(--text); font-weight:600;}
.toc{
  display:flex; flex-wrap:wrap; gap:10px; margin-bottom:60px;
}
.toc a{
  font-family:var(--font-display); font-size:12px; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line); padding:9px 16px; border-radius:20px; transition:all .2s ease;
}
.toc a:hover{border-color:var(--phosphor); color:var(--phosphor);}

.callout{
  background:linear-gradient(160deg, var(--space), var(--space-light)); border:1px solid var(--line);
  border-radius:6px; padding:26px 28px; margin-top:20px; display:flex; gap:16px; align-items:flex-start;
}
.callout .mark{color:var(--star-gold); font-family:var(--font-display); font-weight:700; font-size:13px; flex-shrink:0; margin-top:2px;}
.callout p{color:var(--muted); font-size:14.5px; margin:0;}

/* ---------- REGISTRATION LINK CARDS ---------- */
.reg-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:20px;}
@media (max-width:700px){.reg-grid{grid-template-columns:1fr;}}
.reg-card{
  background:linear-gradient(160deg, var(--space), var(--space-light)); border:1px solid var(--line);
  border-radius:6px; padding:30px 28px;
}
.reg-card h3{font-family:var(--font-display); font-size:17px; margin-bottom:10px;}
.reg-card p{color:var(--muted); font-size:14.5px; margin-bottom:20px;}

/* ---------- TIMELINE (schedule) ---------- */
.timeline{position:relative; margin-top:20px;}
.timeline::before{
  content:''; position:absolute; left:19px; top:12px; bottom:12px; width:1px;
  background:linear-gradient(180deg, var(--star-gold), var(--line) 90%);
}
@media (max-width:700px){.timeline::before{left:11px;}}
.timeline-day{position:relative; padding-left:56px; margin-bottom:52px;}
@media (max-width:700px){.timeline-day{padding-left:36px;}}
.timeline-day:last-child{margin-bottom:0;}
.timeline-day::before{
  content:''; position:absolute; left:12px; top:6px; width:15px; height:15px; border-radius:50%;
  background:var(--void); border:2px solid var(--star-gold); box-shadow:0 0 12px rgba(245,196,81,0.4);
}
@media (max-width:700px){.timeline-day::before{left:4px; width:13px; height:13px;}}
.timeline-day .day-label{font-family:var(--font-display); color:var(--star-gold); font-size:13px; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:4px; display:block;}
.timeline-day h3{font-family:var(--font-display); font-size:21px; margin-bottom:18px;}
.timeline-events{border-left:1px solid var(--line); padding-left:22px;}
.timeline-event{display:flex; gap:18px; padding:10px 0; border-bottom:1px solid var(--line);}
.timeline-event:last-child{border-bottom:none;}
.timeline-event .time{font-family:var(--font-display); color:var(--phosphor); font-size:13px; flex-shrink:0; width:110px;}
.timeline-event .what strong{display:block; font-size:15px; color:var(--text); margin-bottom:2px; font-weight:600;}
.timeline-event .what span{color:var(--muted); font-size:13.5px;}
@media (max-width:600px){
  .timeline-event{flex-direction:column; gap:4px;}
  .timeline-event .time{width:auto;}
}

/* ---------- TASKS ---------- */
.day-heading{
  font-family:var(--font-display); font-size:13px; letter-spacing:0.15em; text-transform:uppercase;
  color:var(--star-gold); margin:60px 0 24px; display:flex; align-items:center; gap:14px;
}
.day-heading:first-of-type{margin-top:0;}
.day-heading::after{content:''; flex:1; height:1px; background:var(--line);}
.task-card{
  background:linear-gradient(160deg, var(--space), var(--space-light)); border:1px solid var(--line);
  border-radius:6px; padding:26px 28px; margin-bottom:18px;
}
.task-card h3{font-family:var(--font-display); font-size:18px; margin-bottom:14px;}
.task-links{display:flex; flex-wrap:wrap; gap:10px;}
.task-links a{
  font-family:var(--font-display); font-size:12px; letter-spacing:0.03em; padding:8px 14px;
  border:1px solid var(--line); border-radius:4px; color:var(--muted); transition:all .2s ease;
}
.task-links a.primary{border-color:rgba(124,255,196,0.4); color:var(--phosphor);}
.task-links a:hover{border-color:var(--star-gold); color:var(--star-gold);}
.task-note{color:var(--muted); font-size:13px; margin-top:14px;}

/* ---------- TEAM (about) ---------- */
.team-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:26px; margin-top:20px;}
@media (max-width:980px){.team-grid{grid-template-columns:repeat(3, 1fr);}}
@media (max-width:700px){.team-grid{grid-template-columns:repeat(2, 1fr);}}
@media (max-width:480px){.team-grid{grid-template-columns:1fr;}}
.team-card{text-align:center;}
.team-photo{
  width:100%; aspect-ratio:1/1; border-radius:50%; overflow:hidden; border:1px solid var(--line);
  margin-bottom:14px; background:var(--space);
}
.team-photo img{width:100%; height:100%; object-fit:cover;}
.team-card h3{font-family:var(--font-display); font-size:14.5px; margin-bottom:6px; font-weight:600;}
.team-card p{color:var(--muted); font-size:12.5px; line-height:1.5;}
.team-group-label{
  font-family:var(--font-display); font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--phosphor); margin:60px 0 24px;
}
.team-group-label:first-of-type{margin-top:0;}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:10px;}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr;}}
.contact-card{
  background:linear-gradient(160deg, var(--space), var(--space-light)); border:1px solid var(--line);
  border-radius:6px; padding:34px;
}
.contact-item{display:flex; gap:16px; padding:16px 0; border-bottom:1px solid var(--line);}
.contact-item:last-child{border-bottom:none;}
.contact-item .icon{
  width:36px; height:36px; border-radius:50%; border:1px solid var(--star-gold); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.contact-item .icon svg{width:16px; height:16px; stroke:var(--star-gold);}
.contact-item .label{font-family:var(--font-display); font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted); margin-bottom:4px;}
.contact-item .value{font-size:15.5px; color:var(--text);}
.contact-item .value a{color:var(--phosphor); border-bottom:1px solid rgba(124,255,196,0.4);}
.map-frame{border-radius:6px; overflow:hidden; border:1px solid var(--line); height:100%; min-height:320px;}
.map-frame iframe{width:100%; height:100%; min-height:320px; border:0; filter:grayscale(0.3) invert(0.92) contrast(0.9);}

/* ---------- RESULTS ---------- */
.results-embed{border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--space);}
.results-embed iframe{width:100%; height:560px; border:0; display:block;}
.results-toolbar{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; margin-bottom:20px;}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--line); padding:50px 0 34px;}
.footer-inner{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px;}
.footer-links{display:flex; gap:22px; flex-wrap:wrap; font-family:var(--font-display); font-size:12px; letter-spacing:0.05em; text-transform:uppercase;}
.footer-links a{color:var(--muted); transition:color .2s ease;}
.footer-links a:hover{color:var(--phosphor);}
.footer-credit{font-size:13px; color:var(--muted); font-family:var(--font-display);}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}