/*
 * Student discount page (templates/default/student_discount.php).
 * Loaded in <head> by index::student_discount() after destination_v2.css;
 * every rule is scoped to .stu-v2. Same conventions as data_calculator.css:
 * white cards, neutral grey fills and borders, navy for accents (step
 * numbers, icons, links). Brand pink is kept for the main CTA buttons only.
 */

.stu-v2 {
   /* Brand pink: main CTA buttons only. */
   --sv-accent: #E8236E;
   --sv-accent-dark: #C2145A;
   --sv-soft: #F4F5F7;
   --sv-navy: #14183A;
   --sv-border: #E6E8EC;
   --sv-text2: #6B6B6B;
   --sv-text3: #8A8A8A;
   --sv-ok: #1E7B4A;
   --sv-error: #C62828;
   --sv-shadow: 0 8px 24px rgba(20, 24, 58, 0.06);
}

.stu-v2 [hidden] {
   display: none !important;
}

/* ---------------------------------------------------------------- */
/* Hero                                                             */
/* ---------------------------------------------------------------- */
.stu-v2 .stu-hero-grid {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: 20px;
   margin-top: 16px;
}

.stu-v2 .stu-hero-copy {
   max-width: 640px;
}

.stu-v2 .dv2-hero h1 {
   margin: 0;
}

@media (min-width: 960px) {
   .stu-v2 .stu-hero-grid {
      grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
      gap: 40px;
      align-items: center;
      margin-top: 24px;
   }
}

/* ---------------------------------------------------------------- */
/* Form card                                                        */
/* ---------------------------------------------------------------- */
.stu-v2 .stu-form-card {
   box-sizing: border-box;
   padding: 20px;
   background: #fff;
   border: 1px solid var(--sv-border);
   border-radius: 20px;
   box-shadow: var(--sv-shadow);
   scroll-margin-top: 100px;
}

@media (min-width: 960px) {
   .stu-v2 .stu-form-card {
      padding: 26px;
   }
}

.stu-v2 .stu-form-title {
   margin: 0 0 14px;
   font-size: 19px;
   font-weight: 700;
   line-height: 1.25;
}

.stu-v2 .stu-label {
   display: block;
   margin: 0 0 6px;
   font-size: 13px;
   font-weight: 600;
   color: var(--sv-navy);
}

.stu-v2 .stu-input {
   box-sizing: border-box;
   display: block;
   width: 100%;
   height: 48px;
   padding: 0 14px;
   border: 1.5px solid var(--sv-border);
   border-radius: 12px;
   background: var(--sv-soft);
   font-family: inherit;
   font-size: 16px;
   color: var(--sv-navy);
   transition: border-color .15s ease, background-color .15s ease;
}

.stu-v2 .stu-input:focus {
   outline: none;
   border-color: var(--sv-navy);
   background: #fff;
}

.stu-v2 .stu-input[aria-invalid="true"] {
   border-color: var(--sv-error);
   background: #fff;
}

.stu-v2 .stu-hint {
   margin: 8px 0 0;
   font-size: 12.5px;
   line-height: 1.45;
   color: var(--sv-text2);
}

.stu-v2 .stu-hint b {
   color: var(--sv-navy);
   font-weight: 600;
}

/* Buttons */
.stu-v2 .stu-btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   box-sizing: border-box;
   min-height: 46px;
   padding: 0 22px;
   border: 0;
   border-radius: 999px;
   font-family: inherit;
   font-size: 15px;
   font-weight: 600;
   line-height: 1.2;
   text-align: center;
   text-decoration: none;
   cursor: pointer;
   transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.stu-v2 .stu-btn-primary {
   background: var(--sv-accent);
   color: #fff;
}

.stu-v2 .stu-btn-primary:hover,
.stu-v2 .stu-btn-primary:focus-visible {
   background: var(--sv-accent-dark);
   color: #fff;
   text-decoration: none;
}

.stu-v2 .stu-btn-ghost {
   background: #fff;
   border: 1.5px solid var(--sv-border);
   color: var(--sv-navy);
}

.stu-v2 .stu-btn-ghost:hover {
   border-color: var(--sv-navy);
   color: var(--sv-navy);
   text-decoration: none;
}

.stu-v2 .stu-form .stu-btn {
   width: 100%;
   margin-top: 14px;
}

/* Phones: taller touch targets, matching the other student forms. */
@media (max-width: 559px) {
   .stu-v2 .stu-form .stu-input {
      height: auto;
      min-height: 52px;
      padding: 0 20px;
      border-radius: 999px;
   }

   .stu-v2 .stu-form .stu-btn {
      min-height: 52px;
      font-size: 16px;
   }
}

.stu-v2 .stu-btn:disabled {
   opacity: .75;
   cursor: default;
}

.stu-v2 .stu-spinner {
   display: none;
   width: 16px;
   height: 16px;
   border: 2px solid rgba(255, 255, 255, 0.45);
   border-top-color: #fff;
   border-radius: 50%;
   animation: stu-spin .7s linear infinite;
}

.stu-v2 .stu-btn.is-loading .stu-spinner {
   display: inline-block;
}

@keyframes stu-spin {
   to {
      transform: rotate(360deg);
   }
}

.stu-v2 .stu-link {
   display: block;
   margin: 10px auto 0;
   padding: 6px 8px;
   border: 0;
   background: none;
   font-family: inherit;
   font-size: 14px;
   font-weight: 600;
   color: var(--sv-navy);
   text-decoration: underline;
   cursor: pointer;
}

/* Inline messages */
.stu-v2 .stu-message {
   margin: 12px 0 0;
   padding: 10px 12px;
   border-radius: 12px;
   font-size: 13.5px;
   line-height: 1.45;
   background: var(--sv-soft);
   border: 1px solid var(--sv-border);
}

.stu-v2 .stu-message-error {
   color: var(--sv-error);
   border-color: rgba(198, 40, 40, 0.35);
}

.stu-v2 .stu-message-ok {
   color: var(--sv-ok);
}

/* Success panel */
.stu-v2 .stu-success {
   text-align: center;
   outline: none;
}

.stu-v2 .stu-success-icon {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 52px;
   height: 52px;
   border-radius: 50%;
   background: var(--sv-soft);
   color: var(--sv-navy);
   font-size: 22px;
}

.stu-v2 .stu-success-title {
   margin: 10px 0 0;
   font-family: 'Poppins', sans-serif;
   font-size: 18px;
   font-weight: 700;
   color: var(--sv-navy);
}

.stu-v2 .stu-success-text {
   margin: 6px 0 0;
   font-size: 14px;
   line-height: 1.5;
   color: var(--sv-text2);
}

.stu-v2 .stu-success .stu-btn {
   width: 100%;
   margin-top: 16px;
}

.stu-v2 .stu-small {
   margin: 14px 0 0;
   padding-top: 12px;
   border-top: 1px solid var(--sv-border);
   font-size: 12px;
   line-height: 1.45;
   color: var(--sv-text3);
}

/* ---------------------------------------------------------------- */
/* How it works                                                     */
/* ---------------------------------------------------------------- */
.stu-v2 .stu-steps {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: 12px;
   margin: 18px 0 0;
   padding: 0;
   list-style: none;
}

@media (min-width: 768px) {
   .stu-v2 .stu-steps {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
   }
}

.stu-v2 .stu-step {
   box-sizing: border-box;
   margin: 0;
   padding: 20px;
   background: #fff;
   border: 1px solid var(--sv-border);
   border-radius: 20px;
   box-shadow: var(--sv-shadow);
}

.stu-v2 .stu-step-num {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 36px;
   height: 36px;
   border-radius: 50%;
   background: var(--sv-navy);
   font-family: 'Poppins', sans-serif;
   font-size: 16px;
   font-weight: 700;
   color: #fff;
}

.stu-v2 .stu-step h3 {
   margin: 12px 0 0;
   font-size: 17px;
   font-weight: 700;
   line-height: 1.3;
}

.stu-v2 .stu-step p {
   margin: 8px 0 0;
   font-size: 14px;
   line-height: 1.6;
}

/* ---------------------------------------------------------------- */
/* Why / who cards                                                  */
/* ---------------------------------------------------------------- */
.stu-v2 .stu-two {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: 16px;
}

@media (min-width: 960px) {
   .stu-v2 .stu-two {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 24px;
   }
}

.stu-v2 .stu-card {
   box-sizing: border-box;
   padding: 22px 20px;
   background: #fff;
   border: 1px solid var(--sv-border);
   border-radius: 20px;
   box-shadow: var(--sv-shadow);
}

@media (min-width: 960px) {
   .stu-v2 .stu-card {
      padding: 28px;
   }
}

.stu-v2 .stu-card h2 {
   margin: 0;
   font-size: 20px;
   font-weight: 700;
   line-height: 1.25;
}

.stu-v2 .stu-card p {
   margin: 10px 0 0;
   font-size: 14.5px;
   line-height: 1.6;
}

.stu-v2 .stu-list,
.stu-v2 .stu-domains {
   margin: 14px 0 0;
   padding: 0;
   list-style: none;
}

.stu-v2 .stu-list li {
   display: flex;
   align-items: flex-start;
   gap: 10px;
   margin: 0 0 8px;
   font-size: 14px;
   line-height: 1.5;
}

.stu-v2 .stu-list i {
   flex: 0 0 auto;
   margin-top: 4px;
   font-size: 12px;
   color: var(--sv-navy);
}

.stu-v2 .stu-list b,
.stu-v2 .stu-card b {
   color: var(--sv-navy);
}

.stu-v2 .stu-domains li {
   display: flex;
   flex-wrap: wrap;
   align-items: baseline;
   gap: 4px 12px;
   margin: 0;
   padding: 10px 14px;
   background: var(--sv-soft);
   border-radius: 12px;
   font-size: 14px;
}

.stu-v2 .stu-domains li + li {
   margin-top: 6px;
}

.stu-v2 .stu-domains b {
   min-width: 120px;
   font-weight: 700;
}

.stu-v2 .stu-domains span {
   color: var(--sv-text2);
}

.stu-v2 .stu-card .stu-note {
   margin-top: 14px;
   font-size: 12.5px;
   color: var(--sv-text3);
}

/* ---------------------------------------------------------------- */
/* Final CTA                                                        */
/* ---------------------------------------------------------------- */
.stu-v2 .stu-cta {
   display: flex;
   flex-direction: column;
   gap: 16px;
   box-sizing: border-box;
   padding: 24px 20px;
   background: #fff;
   border: 1px solid var(--sv-border);
   border-radius: 24px;
   box-shadow: var(--sv-shadow);
   text-align: center;
}

.stu-v2 .stu-cta h2 {
   margin: 0;
   font-size: 22px;
   font-weight: 700;
}

.stu-v2 .stu-cta p {
   margin: 6px 0 0;
   font-size: 15px;
   line-height: 1.5;
}

.stu-v2 .stu-cta-actions {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

@media (min-width: 640px) {
   .stu-v2 .stu-cta-actions {
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
   }
}

@media (min-width: 960px) {
   .stu-v2 .stu-cta {
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      padding: 32px;
      text-align: left;
   }

   .stu-v2 .stu-cta h2 {
      font-size: 28px;
   }

   .stu-v2 .stu-cta-actions {
      justify-content: flex-end;
   }
}