/* Student pages (Discover, For colleges, Campus Ambassador, Agri Hackathon). Loads after site.css and inner.css and reuses their tokens. */
.hero-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:4px}
.hero-acts .cta-btn{font-size:17px;padding:15px 26px}
.hero-link{font-size:17px;font-weight:600;color:var(--on-deep);text-decoration:none;border-bottom:1px solid rgba(241,245,239,.4);padding-bottom:2px}
.hero-link:hover{border-bottom-color:var(--hero-accent)}
.hero-facts{font-size:16px;line-height:1.5;color:var(--on-deep-dim);max-width:46ch}

/* Numbers in a row */
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px}
.figs div{border-top:1px solid var(--line);padding-top:16px;min-width:0}
.figs b{display:block;font-size:clamp(40px,4.2vw,58px);line-height:1;letter-spacing:-.035em;font-weight:700;color:var(--forest)}
.figs span{display:block;font-size:16px;line-height:1.45;color:var(--muted);margin-top:10px}

/* Questions and answers, always open */
.qa{display:flex;flex-direction:column}
.qa div{padding:18px 0;border-top:1px solid var(--line)}
.qa div:last-child{border-bottom:1px solid var(--line)}
.qa h3{font-size:18px;line-height:1.35;letter-spacing:-.005em;font-weight:700;margin-bottom:6px}
.qa p{font-size:17px;line-height:1.6;color:var(--muted);max-width:62ch}
.qa a{color:var(--sky-text)}

/* Sub-challenges */
.subs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:36px}
.sub{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:8px}
.sub-n{font-size:15px;font-weight:700;color:var(--forest)}
.sub h3{font-size:20px;line-height:1.25}
.sub p{font-size:16.5px;line-height:1.55;color:var(--muted)}
.sub-f{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;font-size:14px;line-height:1.4;font-weight:600;color:var(--muted)}
.sub-f b{color:var(--forest);font-weight:700;white-space:nowrap}

/* Grand challenge */
.gc-tags{display:flex;flex-wrap:wrap;gap:8px}
.gc-tags span{font-size:15px;font-weight:700;border-radius:100px;padding:7px 14px;background:var(--card);border:1px solid var(--line)}
.gc-tags span:first-child{background:var(--forest);border-color:var(--forest);color:#F1F5EF}
.track h4{font-size:15px;font-weight:700;color:var(--forest)}

/* Contact people */
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.people div{border-top:1px solid var(--line);padding-top:14px}
.people b{display:block;font-size:18px;font-weight:700}
.people span{display:block;font-size:16px;line-height:1.45;color:var(--muted);margin-top:2px}
.acts{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.acts .link-btn{align-self:center}
.countdown{font-size:16px;font-weight:700;color:var(--forest)}
.countdown:empty{display:none}

/* Forms that open the visitor's email app */
.f select,.f textarea{width:100%;font-family:inherit;font-size:17px;line-height:1.4;padding:14px 16px;border:1px solid rgba(19,32,23,.40);border-radius:12px;background:var(--card);color:var(--ink)}
.f select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%23132017' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.f textarea{min-height:130px;resize:vertical}
.f select:focus,.f textarea:focus{outline:2px solid var(--sky);outline-offset:1px;border-color:var(--sky)}
.f.bad select,.f.bad textarea{border-color:#A5361F}
.f .f-help{font-size:15px;line-height:1.45;color:var(--muted)}
.mail-form{--f-line:rgba(19,32,23,.22);--f-line-strong:rgba(19,32,23,.40);--err:#A5361F;display:flex;flex-direction:column;gap:22px;margin-top:8px}
.prose .mail-form p{max-width:62ch}
.prose .acts{margin-top:4px}
.prose .people{margin:8px 0 4px}

/* Long email addresses must wrap on a phone */
.spec-row a,.qa a,.prose p a,.acts a{overflow-wrap:anywhere}
.acts a{max-width:100%}

@media (max-width:900px){
  .subs,.people{grid-template-columns:minmax(0,1fr)}
  .hero-acts .cta-btn{width:auto}
}

/* Buttons inside prose keep their own colours */
.acts{--f-line-strong:rgba(19,32,23,.40)}
.prose a.btn-main,.prose a.btn-main:hover{color:var(--on-deep);text-decoration:none}
.prose a.btn-quiet,.prose a.btn-quiet:hover{color:var(--ink);text-decoration:none}