/*
 * Career City College landing pages: program and homepage templates.
 *
 * The handoff's own <style> blocks, merged. The program pages' rules come
 * first, as delivered; the homepage-only components (pgrid, whygrid, howgrid,
 * quotegrid, objgrid2, pcard) are added to the same breakpoints. Rules for a
 * component a page does not have simply match nothing there.
 *
 * The !important everywhere is the handoff's: its layout is inline styles, and
 * only !important beats those.
 */

/* Steps, dialogs, errors and the sticky bar are toggled with [hidden]; an
   inline display must never win over it (an Oxford lesson, three times). */
[hidden]{display:none!important}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#FFFCF7;color:#0B2B55;font-family:Jost,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit;text-align:left}
input,select,textarea{font:inherit;color:inherit}
a{color:#F5A614;text-decoration:underline;text-underline-offset:2px}
a:hover{color:#C97F05}
[data-obj]{transition:box-shadow .16s,border-color .16s,background .16s}
[data-obj]:hover{border-color:#F5A614;box-shadow:0 6px 18px rgba(3,43,89,.16);transform:translateY(-1px)}
[data-obj]{transition:box-shadow .16s,border-color .16s,background .16s,transform .16s}
[data-obj][data-sel="1"]{border-color:#F5A614;background:#FFF6E6;box-shadow:0 0 0 2px #F5A614 inset}
[data-obj]:hover [data-tick]{border-color:#F5A614}
[data-obj][data-sel="1"] [data-tick]{background:#2F7A43;border-color:#2F7A43}
[data-obj][data-sel="1"] [data-tick] svg{stroke:#fff}
[data-pcard]{transition:box-shadow .16s,border-color .16s,transform .16s}
[data-pcard]:hover{border-color:#F5A614;box-shadow:0 10px 26px rgba(3,43,89,.14);transform:translateY(-2px)}
@keyframes ccc-fade{from{opacity:0}to{opacity:1}}
@keyframes ccc-pop{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes ccc-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
[data-faq][data-open="1"] [data-faqbody]{display:block}
[data-faq] [data-faqbody]{display:none}
[data-faq][data-open="1"] [data-plus]{transform:rotate(45deg)}

/* The privacy policy dialog's text, so an edited policy looks as delivered without inline styles. */
.lp-policy h2{margin:0;font-family:Jost,sans-serif;font-size:32px;line-height:1.2;font-weight:600;color:#032B59}
.lp-policy h3{margin:22px 0 0;font-size:17px;font-weight:600;color:#032B59}
.lp-policy p{margin:8px 0 0;font-size:16px;line-height:1.6;color:#254C7A}
.lp-policy h2+p{margin:8px 0 0;font-size:14.5px;line-height:normal;color:#6B819D}
.lp-policy h2+p+h3{margin-top:26px}
.lp-policy ul,.lp-policy ol{margin:8px 0 0;padding-left:22px;font-size:16px;line-height:1.6;color:#254C7A}
.lp-policy a{color:#C97F05}

@media (max-width:1080px){
  [data-m=valuegrid]{grid-template-columns:repeat(2,1fr)!important}
  [data-m=valuegrid]>*{border-left:0!important}
  [data-m=careergrid]{grid-template-columns:1fr!important}
  [data-m=careergrid]>*{border-left:0!important;padding-left:0!important;padding-right:0!important;border-top:1px solid rgba(3,43,89,.12);padding-top:26px!important;margin-top:26px!important}
  [data-m=careergrid]>*:first-child{padding-top:0!important;margin-top:0!important}
  /* Stacked CPB card: icon above the text, whole block centred. */
  [data-m=cpbcard]{grid-template-columns:1fr!important;justify-items:center!important;text-align:center!important;gap:12px!important}
  [data-m=careergrid]>*:first-child{border-top:0}
}
/* Hero, header and form stack together at 1100px so the desktop layout never
   compresses into a narrow-tablet column between 900 and 1100px. */
@media (max-width:1100px){
  [data-m=herogrid]{grid-template-columns:1fr!important;gap:0!important}
  [data-m=herophoto]{position:relative!important;left:auto!important;right:auto!important;width:100%!important;height:290px!important}
  [data-m=herodesktop]{display:none!important}
  [data-m=heromobile]{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover;object-position:22% 42%}
  [data-m=heroleft]{padding-top:28px!important;padding-bottom:36px!important;padding-left:0!important}
  [data-m=heroright]{padding-top:0!important;max-width:560px}
  [data-m=headbar]{flex-wrap:wrap!important;gap:12px!important;justify-content:center!important}
  [data-m=headmeta]{border-left:0!important;padding-left:0!important;text-align:center!important;flex:0 0 auto!important}
  [data-m=pgrid]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [data-m=whygrid]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [data-m=howgrid]{grid-template-columns:1fr!important}
  [data-m=quotegrid]{grid-template-columns:1fr!important}
}
@media (max-width:900px){
  [data-m=ctgrid]{grid-template-columns:1fr!important}
  [data-m=ctgrid]>*{grid-column:auto!important;grid-row:auto!important;border-left:0!important;padding-left:0!important}
  [data-m=ctgrid]>*+*{margin-top:30px!important}
  [data-m=road]{grid-template-columns:1fr!important;gap:0!important}
  [data-m=roadline]{display:none!important}
  /* Fixed text column so every icon lands in the same vertical line, with the
     whole block centred as one unit. */
  [data-m=roadstep]{display:grid!important;grid-template-columns:56px 1fr!important;gap:24px!important;align-items:center!important;text-align:left!important;padding:14px 0!important;border-top:1px solid rgba(3,43,89,.12);width:100%!important;max-width:310px!important;justify-self:center!important;margin-left:auto!important;margin-right:auto!important}
  [data-m=roadstep]:first-of-type{border-top:0!important}
  [data-m=faqgrid]{grid-template-columns:1fr!important;gap:36px!important}
  [data-m=faqgrid]>*+*{border-left:0!important;padding-left:0!important;border-top:1px solid rgba(255,255,255,.16);padding-top:32px!important}
  [data-m=trust]{flex-direction:column!important;gap:16px!important;align-items:flex-start!important}
  [data-m=footgrid]{grid-template-columns:1fr!important;gap:20px!important;text-align:left!important}
  [data-m=footgrid]>*{border-left:0!important;padding-left:0!important}
  [data-m=valuegrid]{grid-template-columns:1fr!important}
  [data-m=objgrid2]{grid-template-columns:1fr!important}
  [data-m=h1]{font-size:32px!important}
  [data-m=h2]{font-size:27px!important}
  [data-m=formh]{font-size:32px!important}
}
@media (max-width:900px){
  [data-m=modalgrid]{grid-template-columns:1fr!important}
  [data-m=pitchpanel]{padding:22px 24px 20px!important}
  [data-m=pitchpanel] h3{font-size:19px!important}
  [data-m=pitchstats]{flex-direction:row!important;flex-wrap:wrap!important;gap:12px 24px!important;margin-top:14px!important}
  [data-m=pitchstats]>div>div:first-child{font-size:21px!important}
  [data-m=pitchstats]>div>div:last-child{display:none!important}
  [data-m=pitchtrust],[data-m=pitchquote]{display:none!important}
  [data-m=formcol]{padding:28px 22px 24px!important}
  [data-m=modalcard] [data-m=formh]{font-size:24px!important}
}
/* PHONE ONLY (<=640px). Nothing here can reach the desktop layout. */
@media (max-width:640px){
  /* Jump to the form instantly rather than animating a long scroll. */
  html{scroll-behavior:auto}
  [role=dialog]{padding:12px!important}
  [data-m=modalcard]{border-radius:14px!important}
  [data-m=modalcard] [data-m=formh]{font-size:28px!important}

  section{padding-left:18px!important;padding-right:18px!important}

  /* --- Compact one-row header on phones; the CTA repeats below the facts --- */
  [data-m=headbar]{padding:9px 18px!important;gap:12px!important;flex-wrap:nowrap!important;justify-content:flex-start!important;align-items:center!important}
  [data-m=headlogo] img{height:34px!important}
  [data-m=headmeta]{flex:1 1 auto!important;border-left:1px solid rgba(3,43,89,.16)!important;padding-left:12px!important;text-align:left!important}
  [data-m=headmeta]>div{font-size:11.5px!important;letter-spacing:.03em!important;line-height:1.35!important}
  [data-cta=header]{display:none!important}

  /* --- Full-bleed navy hero: no cream gutter around it --- */
  [data-m=herosection]{padding-left:0!important;padding-right:0!important}
  [data-m=herogrid]{padding-left:0!important;padding-right:0!important}
  [data-m=heroleft]{padding-left:18px!important;padding-right:18px!important}
  [data-m=heroright]{padding-left:18px!important;padding-right:18px!important}

  /* Short mobile-only supporting line. */
  [data-m=subdesk]{display:none!important}
  [data-m=submob]{display:block!important}
  /* Objection tiles: smaller icon and tick give the description a real text column. */
  [data-obj]{grid-template-columns:42px 1fr 24px!important;gap:14px!important;padding:14px!important}
  [data-obj]>span:first-child{width:42px!important;height:42px!important}
  [data-obj] [data-tick]{width:24px!important;height:24px!important}
  [data-m=card],[data-m=ctgrid]{padding:26px 20px!important}
  [data-m=formcard]{padding:22px 18px 20px!important;border-radius:14px!important}
  /* Stat row reads as two rows of two rather than four squeezed columns. */
  [data-m=herostats]{grid-template-columns:1fr 1fr!important;gap:18px 14px!important;margin-top:26px!important}
  /* Paired fields stack so each input keeps a comfortable tap width. */
  [data-m=fpair]{grid-template-columns:1fr!important}
  [data-m=h1]{font-size:27px!important;line-height:1.2!important;text-wrap:balance;letter-spacing:-.01em!important}
  [data-m=h2]{font-size:24px!important}
  [data-m=formh]{font-size:27px!important;text-wrap:balance}
  [data-m=heroleft] p{font-size:17px!important}
  [data-m=herophoto]{height:290px!important}
  [data-m=pgrid]{grid-template-columns:1fr!important}
  [data-m=whygrid]{grid-template-columns:1fr!important}
  /* Sticky CTA sits over the footer, so reserve room for it. */
  footer{padding:24px 18px 96px!important}
  footer a{display:inline-block;padding:11px 0}
}