/* =======================================================
   Layout
======================================================= */

.app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: transparent;
}

.main {
  flex: 1;
  width: min(1280px, 94%);
  margin: 0 auto;
  padding: calc(var(--header-h) + 64px) 32px 96px;
}

@media (max-width:768px){

.main{
  width:100%;
  padding:calc(var(--header-h) + 40px) 20px 72px;
}

}

/* =======================================================
   Buttons
======================================================= */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  padding:12px 22px;

  border-radius:14px;

  border:1px solid transparent;

  font-size:14px;
  font-weight:600;

  cursor:pointer;

  transition:
      background .25s,
      color .25s,
      border-color .25s,
      transform .25s,
      box-shadow .25s;

  white-space:nowrap;
}

.btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.btn:hover:not(:disabled){
  transform:translateY(-2px);
}

.btn-sm{
  padding:9px 16px;
  font-size:13px;
}

.btn-primary{

  background:var(--accent);

  color:white;

  border-color:var(--accent);

}

.btn-primary:hover:not(:disabled){

  background:var(--accent-bright);

  border-color:var(--accent-bright);

  box-shadow:0 18px 35px rgba(77,120,163,.28);

}

.btn-outline{

  background:transparent;

  color:var(--text);

  border-color:var(--border-strong);

}

.btn-outline:hover:not(:disabled){

  background:var(--accent-dim);

  border-color:var(--accent);

  color:white;

}

.btn-ghost{

  background:none;

  border:none;

  color:var(--text-muted);

}

.btn-ghost:hover:not(:disabled){

  background:var(--social-bg);

  color:white;

}

.btn-chip{

  padding:8px 14px;

  border-radius:999px;

  border:1px solid var(--border);

  background:var(--social-bg);

  color:var(--text-muted);

  font-size:12px;

  transition:.25s;

}

.btn-chip:hover{

  border-color:var(--accent-border);

  background:var(--accent-dim);

  color:white;

}

/* =======================================================
   Header
======================================================= */

.site-header{

  position:fixed;

  inset:0 0 auto 0;

  z-index:100;

  height:var(--header-h);

  background:rgba(16,18,20,.82);

  backdrop-filter:blur(18px);

  border-bottom:1px solid rgba(255,255,255,.06);

}

.site-header__inner{

  width:min(1320px,94%);

  height:100%;

  margin:auto;

  display:flex;

  align-items:center;

  justify-content:space-between;

}

.site-logo{

  display:flex;

  align-items:center;

  gap:14px;

  border:none;

  background:none;

  cursor:pointer;

}

.site-logo__mark{

  width:42px;

  height:42px;

  display:grid;

  place-items:center;

  border-radius:14px;

  background:linear-gradient(
      135deg,
      var(--accent-bg),
      rgba(255,255,255,.03)
  );

  border:1px solid var(--accent-border);

  color:var(--accent-bright);

  transition:.25s;

}

.site-logo:hover .site-logo__mark{

  transform:rotate(-6deg) scale(1.05);

}

.site-logo__text strong{

  font-size:20px;

  font-family:var(--font-display);

  font-weight:400;

  color:white;

}

.site-logo__text small{

  color:var(--text-faint);

  font-size:12px;

}

.site-nav{

  display:flex;

  gap:6px;

  align-items:center;

}

/* =======================================================
   Hero
======================================================= */

.hero-section{

  margin-bottom:80px;

}

.hero-section__content{

  max-width:920px;

  margin-bottom:42px;

}

.hero-section__eyebrow{

  font-size:13px;

  letter-spacing:.18em;

  text-transform:uppercase;

  font-weight:700;

  color:var(--accent);

  margin-bottom:22px;

}

.hero-section__title{

  font-family:var(--font-display);

  font-size:clamp(3rem,6vw,5rem);

  line-height:1.02;

  letter-spacing:-.05em;

  max-width:900px;

  color:white;

  margin-bottom:24px;

}

.hero-section__desc{

  font-size:19px;

  line-height:1.85;

  max-width:720px;

  color:var(--text-muted);

}

/* =======================================================
   Verify Card
======================================================= */

.verify-card{

  background:linear-gradient(
      180deg,
      rgba(255,255,255,.03),
      rgba(255,255,255,.015)
  );

  border:1px solid var(--border);

  border-radius:28px;

  padding:34px;

  backdrop-filter:blur(12px);

  box-shadow:var(--shadow);

}

.verify-card__label{

  font-size:12px;

  letter-spacing:.08em;

  text-transform:uppercase;

  color:var(--text-muted);

  margin-bottom:12px;

}

.verify-card__input{

  width:100%;

  min-height:180px;

  background:var(--bg-input);

  border:1px solid var(--border);

  border-radius:18px;

  padding:20px;

  color:white;

  font-size:16px;

  line-height:1.75;

  resize:none;

  transition:.25s;

}

.verify-card__input::placeholder{

  color:var(--text-faint);

}

.verify-card__input:focus{

  outline:none;

  border-color:var(--accent);

  box-shadow:0 0 0 4px var(--accent-bg);

}

.sample-claims{

  margin-top:18px;

}

.sample-claims__list{

  display:flex;

  flex-wrap:wrap;

  gap:10px;

}

.verify-card__actions{

  display:flex;

  justify-content:space-between;

  align-items:center;

  flex-wrap:wrap;

  gap:18px;

  margin-top:26px;

  padding-top:22px;

  border-top:1px solid var(--border);

}
/* =======================================================
   Error
======================================================= */

.error-banner{
    background:linear-gradient(
        135deg,
        rgba(188,100,100,.12),
        rgba(188,100,100,.04)
    );

    border:1px solid var(--danger-border);

    border-left:4px solid var(--danger);

    border-radius:18px;

    padding:18px 22px;

    color:#ffbcbc;

    font-size:15px;

    margin-bottom:28px;

    box-shadow:var(--shadow);
}

/* =======================================================
   Results
======================================================= */

.results{

    display:flex;

    flex-direction:column;

    gap:24px;

    margin-bottom:80px;

}

.results-card{

    background:linear-gradient(
        180deg,
        rgba(255,255,255,.03),
        rgba(255,255,255,.015)
    );

    border:1px solid var(--border);

    border-radius:28px;

    padding:34px;

    box-shadow:var(--shadow);

}

.results-card__header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:24px;

    margin-bottom:28px;

}

.results-card__row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:18px;

    margin-bottom:18px;

}

.results-stats{

    display:flex;

    gap:36px;

}

.results-stat{

    display:flex;

    flex-direction:column;

    align-items:flex-end;

}

.results-stat__value{

    font-size:2rem;

    color:white;

    font-family:var(--font-display);

    line-height:1;

}

.results-stat__label{

    margin-top:6px;

    font-size:11px;

    letter-spacing:.1em;

    text-transform:uppercase;

    color:var(--text-faint);

}

/* =======================================================
   Verdict Badge
======================================================= */

.verdict-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:10px 18px;

    border-radius:999px;

    font-size:14px;

    font-weight:700;

    border:1px solid;

}

.verdict--success{

    background:var(--success-bg);

    border-color:var(--success-border);

    color:#84d39f;

}

.verdict--danger{

    background:var(--danger-bg);

    border-color:var(--danger-border);

    color:#ffb0b0;

}

.verdict--warning{

    background:var(--warning-bg);

    border-color:var(--warning-border);

    color:#ffd27f;

}

.verdict--neutral{

    background:var(--neutral-bg);

    border-color:var(--neutral-border);

    color:#c0c7cf;

}

/* =======================================================
   Cache
======================================================= */

.results-cache{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:var(--accent);

    margin-bottom:18px;

    font-size:13px;

}

/* =======================================================
   Evidence Blocks
======================================================= */

.results-block{

    margin-bottom:22px;

}

.results-block:last-child{

    margin-bottom:0;

}

.results-block--accent{

    background:linear-gradient(
        180deg,
        rgba(77,120,163,.12),
        rgba(77,120,163,.04)
    );

    border:1px solid var(--accent-border);

    border-radius:18px;

    padding:18px;

}

.results-block__heading{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:12px;

    font-size:12px;

    text-transform:uppercase;

    letter-spacing:.1em;

    font-weight:700;

    color:var(--text-muted);

}

.results-block__text{

    margin:0;

    color:var(--text);

    line-height:1.8;

}

.results-block__text--muted{

    color:var(--text-muted);

    font-size:15px;

}

.results-list{

    margin:0;

    padding-left:20px;

    color:var(--text-muted);

}

.results-list li{

    margin-bottom:8px;

}

/* =======================================================
   Takeaway
======================================================= */

.results-takeaway{

    display:flex;

    gap:14px;

    align-items:flex-start;

    background:var(--bg-elevated);

    border:1px solid var(--border);

    border-radius:18px;

    padding:18px;

}

.results-takeaway strong{

    color:var(--accent);

}

.results-takeaway p{

    margin:0;

    color:var(--text-muted);

    line-height:1.7;

}

/* =======================================================
   Citations
======================================================= */

.citations{

    margin-top:28px;

    padding-top:20px;

    border-top:1px solid var(--border);

}

.citations__title{

    margin-bottom:14px;

    font-size:12px;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:var(--text-faint);

}

.citation-row{

    margin-bottom:12px;

}

.citation-link{

    color:var(--accent-bright);

    text-decoration:none;

    transition:.25s;

}

.citation-link:hover{

    color:white;

    text-decoration:underline;

}

.citation-text{

    color:var(--text-muted);

    margin-top:4px;

    font-size:14px;

}

/* =======================================================
   Quality Badge
======================================================= */

.quality-badge{

    display:inline-flex;

    align-items:center;

    padding:6px 14px;

    border-radius:999px;

    font-size:11px;

    letter-spacing:.08em;

    text-transform:uppercase;

    font-weight:700;

}

.quality-badge--high{

    background:var(--success-bg);

    border:1px solid var(--success-border);

    color:#84d39f;

}

.quality-badge--medium{

    background:var(--warning-bg);

    border:1px solid var(--warning-border);

    color:#ffd27f;

}

.quality-badge--low{

    background:var(--danger-bg);

    border:1px solid var(--danger-border);

    color:#ffb0b0;

}

/* =======================================================
   Papers
======================================================= */

.papers-list{

    display:flex;

    flex-direction:column;

    gap:16px;

    margin-top:28px;

}

.paper-item{

    background:rgba(255,255,255,.015);

    border:1px solid var(--border);

    border-radius:20px;

    overflow:hidden;

    transition:.25s;

}

.paper-item:hover{

    border-color:var(--accent-border);

    transform:translateY(-2px);

}

.paper-item__toggle{

    width:100%;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:18px 20px;

    background:none;

    border:none;

    color:inherit;

}

.paper-item__body{

    padding:20px;

    border-top:1px solid var(--border);

}

.paper-metrics{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:12px;

    margin-bottom:18px;

}

.paper-metric{

    background:var(--bg-elevated);

    border-radius:14px;

    padding:14px;

    text-align:center;

}

.paper-metric span{

    display:block;

    font-size:11px;

    color:var(--text-faint);

    text-transform:uppercase;

    margin-bottom:6px;

}

.paper-metric strong{

    color:white;

}

.paper-item__summary{

    color:var(--text-muted);

    line-height:1.8;

}

.paper-item__journal{

    margin-top:10px;

    color:var(--text-faint);

    font-size:13px;

}
/* =======================================================
   Sections
======================================================= */

.section{
    padding:90px 0;
    border-top:1px solid var(--border);
}

.section--last{
    padding-bottom:60px;
}

.section__header{
    margin-bottom:48px;
}

.section__eyebrow{

    color:var(--accent);

    font-size:13px;

    letter-spacing:.16em;

    text-transform:uppercase;

    font-weight:700;

    margin-bottom:18px;

}

.section__title{

    font-family:var(--font-display);

    font-size:clamp(2rem,5vw,3.3rem);

    line-height:1.1;

    color:white;

    margin-bottom:18px;

}

.section__desc{

    max-width:760px;

    color:var(--text-muted);

    font-size:18px;

    line-height:1.85;

}

/* =======================================================
   About
======================================================= */

.steps-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:24px;

}

.step-card{

    background:linear-gradient(
        180deg,
        rgba(255,255,255,.03),
        rgba(255,255,255,.015)
    );

    border:1px solid var(--border);

    border-radius:24px;

    padding:28px;

    transition:.3s;

    box-shadow:var(--shadow);

}

.step-card:hover{

    transform:translateY(-6px);

    border-color:var(--accent-border);

}

.step-card__icon{

    width:52px;

    height:52px;

    border-radius:16px;

    display:grid;

    place-items:center;

    background:var(--accent-bg);

    border:1px solid var(--accent-border);

    color:var(--accent);

    margin-bottom:20px;

}

.step-card h3{

    margin:0 0 12px;

    font-size:20px;

    color:white;

}

.step-card p{

    margin:0;

    color:var(--text-muted);

    line-height:1.8;

}

/* =======================================================
   Feature Strip
======================================================= */

.feature-strip{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

    margin-top:30px;

}

.feature-strip__item{

    display:flex;

    align-items:center;

    gap:8px;

    padding:12px 18px;

    border-radius:999px;

    border:1px solid var(--border);

    background:var(--social-bg);

    transition:.25s;

}

.feature-strip__item:hover{

    background:var(--accent-dim);

    border-color:var(--accent-border);

}

/* =======================================================
   Founder
======================================================= */

.founder-card{

    display:flex;

    gap:28px;

    background:linear-gradient(
        180deg,
        rgba(255,255,255,.03),
        rgba(255,255,255,.015)
    );

    border:1px solid var(--border);

    border-radius:28px;

    padding:34px;

    box-shadow:var(--shadow);

}

@media(max-width:760px){

.founder-card{

    flex-direction:column;

}

}

.founder-card__avatar{

    width:84px;

    height:84px;

    border-radius:22px;

    display:grid;

    place-items:center;

    background:var(--accent-bg);

    border:1px solid var(--accent-border);

    color:var(--accent);

    font-size:28px;

    font-family:var(--font-display);

}

.founder-card h3{

    margin:0;

    color:white;

    font-size:2rem;

}

.founder-card__role{

    margin:8px 0 18px;

    color:var(--accent);

}

.founder-card__bio{

    color:var(--text-muted);

    line-height:1.9;

}

.founder-card__actions{

    display:flex;

    gap:12px;

    flex-wrap:wrap;

}

/* =======================================================
   Contact
======================================================= */

.contact-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

    gap:24px;

}

.contact-card{

    background:linear-gradient(
        180deg,
        rgba(255,255,255,.03),
        rgba(255,255,255,.015)
    );

    border:1px solid var(--border);

    border-radius:22px;

    padding:26px;

    transition:.3s;

    box-shadow:var(--shadow);

}

.contact-card:hover{

    transform:translateY(-5px);

    border-color:var(--accent-border);

}

.contact-card__icon{

    width:48px;

    height:48px;

    border-radius:14px;

    display:grid;

    place-items:center;

    background:var(--accent-bg);

    color:var(--accent);

    margin-bottom:20px;

}

.contact-card__label{

    font-size:12px;

    text-transform:uppercase;

    letter-spacing:.12em;

    color:var(--text-faint);

}

.contact-card__value{

    font-size:20px;

    color:white;

    margin:10px 0;

}

.contact-card__desc{

    color:var(--text-muted);

    line-height:1.7;

}

/* =======================================================
   Footer
======================================================= */

.site-footer{

    margin-top:90px;

    border-top:1px solid var(--border);

    background:rgba(255,255,255,.02);

}

.site-footer__inner{

    width:min(1280px,94%);

    margin:auto;

    padding:50px 24px;

}

.site-footer__brand{

    display:flex;

    align-items:center;

    gap:16px;

    margin-bottom:28px;

}

.site-footer__name{

    color:white;

    font-family:var(--font-display);

    font-size:26px;

}

.site-footer__tagline{

    color:var(--text-muted);

}

.site-footer__links{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

    margin-bottom:28px;

}

.site-footer__copy{

    padding-top:24px;

    border-top:1px solid var(--border);

    color:var(--text-faint);

    font-size:13px;

}

/* =======================================================
   Scrollbar
======================================================= */

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-track{

    background:var(--bg);

}

::-webkit-scrollbar-thumb{

    background:rgba(255,255,255,.12);

    border-radius:999px;

}

::-webkit-scrollbar-thumb:hover{

    background:var(--accent);

}

/* =======================================================
   Animations
======================================================= */

.verify-card,
.results-card,
.step-card,
.paper-item,
.contact-card,
.founder-card{

    animation:fadeUp .6s ease both;

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(20px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/* =======================================================
   Mobile
======================================================= */

@media(max-width:768px){

.results-card,
.verify-card,
.contact-card,
.step-card,
.founder-card{

    padding:22px;

}

.hero-section__title{

    font-size:3rem;

}

.hero-section__desc{

    font-size:17px;

}

.results-stats{

    gap:18px;

}

.paper-metrics{

    grid-template-columns:1fr;

}

}