.start-hero { position: relative; overflow: hidden; padding-block: clamp(5rem, 10vw, 8rem); background: radial-gradient(circle at 78% 45%, rgba(164, 119, 53, 0.2), transparent 22rem), linear-gradient(105deg, rgba(8, 15, 31, 0.98), rgba(17, 27, 48, 0.91)), image-set(url("../images/heroes/cosmos-hero.avif") type("image/avif"), url("../images/heroes/cosmos-hero.webp") type("image/webp"), url("../images/heroes/cosmos-hero.jpg") type("image/jpeg")) center / cover; color: #fff; }
.start-hero::after { position: absolute; right: -8rem; bottom: -13rem; width: 32rem; height: 32rem; border: 1px solid rgba(216, 189, 145, 0.25); border-radius: 50%; content: ""; }
.start-hero .tem-eyebrow { color: #d8bd91; }
.start-hero .tem-display { max-width: 48rem; color: #fff; font-size: clamp(2.75rem, 5.2vw, 4.2rem); }
.start-hero .tem-lead { max-width: 44rem; color: #d7dbe5; }
.start-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(20rem, 0.85fr); align-items: center; gap: clamp(2.5rem, 6vw, 5rem); padding-inline: clamp(0.5rem, 1.5vw, 1rem); }
.start-button--light { border: 1px solid rgba(255, 255, 255, 0.72); color: #fff; }
.start-button--light:hover { background: rgba(255, 255, 255, 0.1); }
.start-hero__compass { position: relative; width: min(100%, 25rem); aspect-ratio: 1; display: grid; place-items: center; margin: auto; border: 1px solid rgba(216, 189, 145, 0.62); border-radius: 50%; color: #d7dbe5; }
.start-hero__compass::before, .start-hero__compass::after { position: absolute; background: rgba(216, 189, 145, 0.35); content: ""; }
.start-hero__compass::before { width: 1px; height: 86%; }
.start-hero__compass::after { width: 86%; height: 1px; }
.start-hero__compass strong { display: grid; width: 4.5rem; height: 4.5rem; place-items: center; border: 1px solid #d8bd91; border-radius: 50%; background: #11192b; color: #fff; font-family: var(--tem-font-display); font-size: 1.5rem; }
.start-hero__compass span { position: absolute; max-width: 8rem; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.1em; line-height: 1.35; text-align: center; text-transform: uppercase; }
.start-hero__compass span:nth-child(1) { top: 7%; }
.start-hero__compass span:nth-child(2) { right: 3%; top: 50%; transform: translateY(-50%); }
.start-hero__compass span:nth-child(3) { bottom: 7%; }
.start-hero__compass span:nth-child(4) { left: 3%; top: 50%; transform: translateY(-50%); }
.start-heading { max-width: 52rem; margin-bottom: var(--tem-space-10); }
.start-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tem-space-5); }
.start-choice-card { position: relative; min-height: 22rem; display: flex; flex-direction: column; padding: var(--tem-space-8); border: 1px solid var(--tem-color-border); border-radius: var(--tem-radius-lg); background: var(--tem-color-surface); box-shadow: var(--tem-shadow-sm); }
.start-choice-card--accent { border-top: 3px solid var(--tem-color-accent); }
.start-choice-card__number { position: absolute; top: var(--tem-space-5); right: var(--tem-space-6); color: #e4ded3; font: 700 3.25rem/1 var(--tem-font-display); }
.start-choice-card .tem-subheading { max-width: 31rem; }
.start-choice-card .tem-button { align-self: flex-start; margin-top: auto; }
.start-steps { background: var(--tem-color-accent-soft); }
.start-steps__grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: var(--tem-space-16); }
.start-step-list { margin: 0; padding: 0; list-style: none; }
.start-step-list li { display: grid; grid-template-columns: 3rem 1fr; gap: var(--tem-space-5); padding: var(--tem-space-5) 0; border-bottom: 1px solid rgba(164, 119, 53, 0.28); }
.start-step-list li > span { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid var(--tem-color-accent); border-radius: 50%; color: var(--tem-color-primary); font-family: var(--tem-font-display); font-weight: 700; }
.start-step-list strong { color: var(--tem-color-ink); font-family: var(--tem-font-display); font-size: 1.1rem; }
.start-step-list p { margin: 0.35rem 0 0; }
.start-guidance__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: var(--tem-space-16); align-items: start; }
.start-guidance__grid p { margin-top: 0; line-height: 1.8; }
.start-final .tem-cta { border-top: 3px solid var(--tem-color-accent); }
@media (max-width: 900px) { .start-hero__grid { grid-template-columns: minmax(0, 1fr) 18rem; gap: var(--tem-space-8); } .start-hero .tem-display { font-size: clamp(2.6rem, 6vw, 3.7rem); } }
@media (max-width: 760px) { .start-hero__grid, .start-choice-grid, .start-steps__grid, .start-guidance__grid { grid-template-columns: 1fr; } .start-hero__compass { display: none; } .start-choice-card { min-height: auto; } .start-choice-card .tem-button { margin-top: var(--tem-space-5); } .start-hero .tem-display { font-size: clamp(2.2rem, 11vw, 3.2rem); } .start-steps__grid, .start-guidance__grid { gap: var(--tem-space-8); } }
@media (max-width: 360px) {
  .start-guidance__grid > * { min-width: 0; }
  .start-guidance__grid .tem-heading { font-size: 1.55rem; }
}
