/* Additions to site.css: icons, CTA cards, journeys, mobile action bar, Thank You page. One responsive layout for all screen sizes. */
html,body{max-width:100%;overflow-x:clip}
img,svg,video{max-width:100%}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:#fff;color:var(--navy);padding:10px 16px;border-radius:12px;font-weight:700;box-shadow:var(--sh)}
.skip:focus{top:12px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
/* icons (SVG replaces emoji) */
.ico{width:1.15em;height:1.15em;vertical-align:-.2em;flex:none;display:inline-block}
.ico .fl{fill:currentColor;stroke:none}
.im .ico,.ph .ico{width:.62em;height:.62em;stroke-width:1.4;opacity:.95}
.ie .ico,.ci .ico,.cl .ico{width:1.35em;height:1.35em}
.ie,.ci{display:inline-grid;place-items:center}
.plane .ico{width:1em;height:1em}
.mbar .chip .ico{width:1.25em;height:1.25em;color:var(--b)}
/* the two CTA cards */
.two{gap:22px}
@media(min-width:800px){.two{grid-template-columns:1fr 1fr}}
.pn{min-height:250px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:38px 34px 38px;box-shadow:0 24px 50px rgba(30,30,120,.22),inset 0 1px 0 rgba(255,255,255,.28)}
.pn h3{max-width:340px}
.pn p{max-width:340px;margin-bottom:22px}
.pn .btn{position:relative;z-index:2;background:#fff;color:var(--navy);box-shadow:0 6px 0 rgba(10,20,70,.28),0 14px 24px rgba(10,20,70,.2);padding:13px 24px}
.pn.b .btn{color:#a30310}
.pn .btn:hover{transform:translateY(3px);box-shadow:0 3px 0 rgba(10,20,70,.28),0 8px 16px rgba(10,20,70,.2)}
.pn .em.ill{position:absolute;right:22px;bottom:18px;top:auto;width:128px;height:128px;font-size:0;opacity:.9;filter:none;display:block;pointer-events:none}
.pn .em.ill svg{width:100%;height:100%}
.pn.a{background:linear-gradient(140deg,#2f6bff,#0a2a7a)}
@media(max-width:799px){.pn{min-height:0;padding:30px 24px 28px}.pn .btn{width:100%;max-width:none}.pn .em.ill{width:72px;height:72px;top:18px;bottom:auto;right:16px;opacity:.75}.pn h3{max-width:68%;font-size:22px}.pn p{max-width:none}}
/* popup extras */
.jx{display:grid;gap:0;margin-bottom:12px}
.jx label,#lf label{margin-bottom:12px}
.jx label{margin-bottom:0}
label small{font-weight:500;color:var(--mu)}
.ferr{background:#fdecee;color:#b3081c;border:1px solid #f5c2c8;border-radius:12px;padding:10px 12px;font-size:14px;font-weight:600;margin:0 0 12px}
#lsub[disabled]{opacity:.7;cursor:progress;transform:none}
.mdl{max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);overscroll-behavior:contain}
.ok .nx{margin:14px auto 0;max-width:360px;font-size:13px;color:var(--mu)}
.ok .ref{display:inline-block;margin-top:10px;font:700 12px 'DM Sans',sans-serif;letter-spacing:.5px;color:var(--navy);background:rgba(47,107,255,.1);border-radius:99px;padding:5px 12px}
/* mobile action bar */
.mbar{display:none}
@media(max-width:900px){
 body{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}
 .mbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;gap:12px;align-items:center;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--bd)}
 .mbar .btn{flex:1;padding:12px 16px;box-shadow:0 5px 0 #7a0209}
 .mbar .chip{flex:none;display:flex;gap:6px;align-items:center;font:700 12px/1.25 'DM Sans',system-ui,sans-serif;color:var(--navy);max-width:112px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.t3d{transform:none!important}}
/* free-flight badge: clean ticket icon instead of the gold crown */
.crown{border:1px solid rgba(255,255,255,.45)!important;transform:none!important;color:#fff;box-shadow:none!important;width:64px!important;height:64px!important}
.crown .ico{width:30px;height:30px}
.ham{display:none;line-height:0;min-width:44px;min-height:44px}
@media(max-width:900px){.ham{display:grid;place-items:center}}
/* icon tiles sit on saturated gradients: draw their icons in white */
.im .ico,.ph .ico{color:rgba(255,255,255,.96)}

/* shared Thank You page */
.ty{min-height:60vh;display:grid;place-items:center;padding-top:150px;padding-bottom:70px}
.ty-card{width:100%;max-width:640px;text-align:center;background:#fff;border:1px solid var(--bd);border-radius:28px;padding:44px 28px 40px;box-shadow:0 24px 50px rgba(30,30,120,.14)}
.ty-tick{width:88px;height:88px;margin:0 auto 22px;border-radius:50%;background:linear-gradient(#37d47e,#1ea85f);box-shadow:0 6px 0 #14804a,0 16px 26px rgba(30,168,95,.3);display:grid;place-items:center}
.ty-tick svg{width:42px;height:42px;fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.ty h1{font-size:clamp(30px,5vw,42px);margin-bottom:8px;color:var(--navy)}.ty h1:focus{outline:none}
.ty-lead{font-weight:700;font-size:18px;color:var(--tx);margin-bottom:10px}
.ty-sub,.ty-note{color:var(--mu);max-width:460px;margin:0 auto 14px}.ty-note{color:var(--tx)}
.ty-files{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:10px 0 16px}
.ty .ref{display:inline-block;font:700 12px 'DM Sans',sans-serif;letter-spacing:.5px;color:var(--navy);background:rgba(47,107,255,.1);border-radius:99px;padding:5px 12px;margin-bottom:12px}
.ty .btn{margin-top:6px}
@media(max-width:600px){.ty{padding-top:120px}.ty-card{padding:34px 18px 30px;border-radius:22px}.ty .btn{width:100%}}

.fc[href="/courses/cybersecurity"] .fi,.fc[href="/courses/data-science-analytics"] .fi,.fc[href="/courses/digital-marketing"] .fi,.fc[href="/courses/economics"] .fi{background-size:cover!important;background-position:center!important}
.fc[href="/courses/cybersecurity"] .fi{background-image:url("/assets/img/courses/cybersecurity.webp")!important}
.fc[href="/courses/data-science-analytics"] .fi{background-image:url("/assets/img/courses/data-science-analytics.webp")!important}
.fc[href="/courses/digital-marketing"] .fi{background-image:url("/assets/img/courses/digital-marketing.webp")!important}
.fc[href="/courses/economics"] .fi{background-image:url("/assets/img/courses/economics.webp")!important}
.fc[href="/courses/cybersecurity"] .fi:before,.fc[href="/courses/cybersecurity"] .fi:after,.fc[href="/courses/data-science-analytics"] .fi:before,.fc[href="/courses/data-science-analytics"] .fi:after,.fc[href="/courses/digital-marketing"] .fi:before,.fc[href="/courses/digital-marketing"] .fi:after,.fc[href="/courses/economics"] .fi:before,.fc[href="/courses/economics"] .fi:after,.fc[href="/courses/cybersecurity"] .fi .fe,.fc[href="/courses/data-science-analytics"] .fi .fe,.fc[href="/courses/digital-marketing"] .fi .fe,.fc[href="/courses/economics"] .fi .fe{display:none}
.fc[href="/courses/law"] .fi .course-photo{object-position:center 60%}

/* ---- Hello France: programme finder, university filters, nine-column programme rows ---- */
.pt.f9{min-width:1180px}
.pt.f9 .prh,.pt.f9 .pr{grid-template-columns:minmax(170px,1.3fr) minmax(200px,1.7fr) 100px 80px 128px 78px 96px 126px 132px}
.pr .pm{display:block;font-size:12px;color:#7a85aa;font-weight:600;margin-top:2px}
.pr .dlc{font-weight:700;color:#b30814}
.pr .btn.pl{padding:9px 10px;font-size:12.5px;line-height:1.2;text-align:center;display:inline-block}
.pr .btn.g.pl{box-shadow:none}
.pff{align-items:center}
.pff select,.ufs select{padding:10px 12px;border-radius:14px;border:1.5px solid #d6d9f0;background:#fff;font:600 13.5px 'DM Sans',system-ui,sans-serif;color:#243463;max-width:220px;min-width:0}
.pff select:focus,.ufs select:focus{outline:none;border-color:#2f6bff}
.pff .pfq{flex:1 1 240px}
.pfs{padding-top:34px}
.pfs .pff{border:1px solid var(--bd);border-radius:20px 20px 0 0}
.pfw{overflow-x:auto;border:1px solid var(--bd);border-top:0;border-radius:0 0 20px 20px;background:#fff}
.pfs .prh{position:static}
.ufs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.uc .el2{margin-top:auto;width:100%;text-align:center;padding:12px 14px;font-size:14px;margin-bottom:10px}
.uc .el2+.el{margin-top:0}
@media(max-width:900px){
 .pt.f9{min-width:0}
 .pfw{border:0;overflow:visible;background:none}
 .pfs .pff{border-radius:20px}
 .pff select{max-width:none;flex:1 1 45%}
 .pr .btn.pl{width:100%}
 .ufs select{flex:1 1 45%;max-width:none}
}
.pr .c{min-width:0;overflow-wrap:anywhere}
.pr .c.pn2,.pr .c.u span{overflow-wrap:break-word;word-break:normal}
