:root {
  --navy: #12385d;
  --navy-dark: #082c52;
  --blue: #2986d8;
  --sky: #eaf7fd;
  --turquoise: #21b7ae;
  --turquoise-dark: #12968f;
  --yellow: #f8c841;
  --coral: #f08b76;
  --ink: #193b5c;
  --muted: #587087;
  --line: #dce9f0;
  --white: #ffffff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: "Nunito Sans", "Avenir Next", "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid rgba(220, 233, 240, .8);
  backdrop-filter: blur(14px);
}
.header-inner, .hero-inner, .section-inner, .footer-inner, .footer-legal {
  width: min(1320px, calc(100% - 48px));
  margin-inline: auto;
}
.header-inner { height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 13px; color: var(--navy-dark); font-weight: 850; font-size: 22px; letter-spacing: -.5px; white-space: nowrap; }
.brand-mark { position: relative; width: 34px; height: 42px; display: block; }
.brand-mark i { position: absolute; bottom: 2px; width: 15px; height: 30px; border-radius: 80% 8% 80% 8%; transform-origin: bottom; }
.brand-mark i:first-child { left: 3px; background: var(--turquoise); transform: rotate(-28deg); }
.brand-mark i:nth-child(2) { right: 3px; background: var(--yellow); transform: rotate(28deg) scaleX(-1); }
.brand-mark b { position: absolute; top: 0; left: 14px; width: 8px; height: 8px; background: var(--navy); border-radius: 50%; }
.nav { display: flex; align-items: center; gap: clamp(13px, 1.45vw, 25px); font-weight: 700; font-size: 14px; }
.nav a { position: relative; padding-block: 31px 28px; white-space: nowrap; }
.nav a::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 17px; height: 3px; border-radius: 4px; background: var(--blue); transition: .2s ease; }
.nav a:hover::after, .nav a.active::after { left: 22%; right: 22%; }
.nav a.nav-ief { margin-left: 2px; padding: 11px 15px; border-radius: 9px; color: #fff; background: var(--navy); }
.nav a.nav-ief::after { display: none; }
.menu-button { display: none; border: 0; background: none; padding: 8px; }

.hero { overflow: hidden; background: linear-gradient(112deg, #fff 0 34%, #f5fbfe 57%, #e4f4fb 100%); position: relative; }
.hero::before { content: ""; position: absolute; width: 520px; height: 520px; background: #fff; border-radius: 45% 55% 44% 56%; left: -290px; top: -260px; opacity: .9; }
.hero-inner { min-height: 595px; display: grid; grid-template-columns: 44% 56%; align-items: center; }
.hero-copy { position: relative; z-index: 2; padding: 74px 30px 75px 0; animation: enter .55s ease-out both; }
.eyebrow { margin: 0 0 15px; color: var(--turquoise-dark); font-size: 13px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
h1 { margin: 0; max-width: 640px; color: var(--navy-dark); font-size: clamp(48px, 4.65vw, 76px); line-height: 1.01; letter-spacing: -.055em; font-weight: 900; }
h1 strong { display: block; color: var(--turquoise); font-weight: 900; }
.hero-text { max-width: 585px; margin: 27px 0 0; color: var(--ink); font-size: clamp(18px, 1.45vw, 21px); line-height: 1.55; }
.hero-actions { display: flex; align-items: center; gap: 16px; margin-top: 31px; }
.button { min-height: 54px; display: inline-flex; align-items: center; justify-content: center; gap: 15px; border-radius: 11px; padding: 0 24px; border: 1.5px solid transparent; font-weight: 800; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button span, .product-footer a span { transition: transform .2s ease; }
.button:hover { transform: translateY(-2px); }
.button:hover span, .product-footer a:hover span { transform: translateX(4px); }
.button.primary { color: #fff; background: linear-gradient(135deg, var(--turquoise), #19a9c0); box-shadow: 0 10px 24px rgba(33, 183, 174, .2); }
.button.primary:hover { box-shadow: 0 14px 30px rgba(33, 183, 174, .28); }
.button.secondary { color: var(--blue); background: rgba(255,255,255,.82); border-color: var(--blue); }
.button.secondary:hover { background: #fff; }
.hero-proof { display: flex; gap: 22px; margin-top: 25px; color: var(--muted); font-size: 13px; font-weight: 700; }
.hero-proof span::first-letter { color: var(--turquoise); }
.hero-visual { height: 100%; position: relative; display: flex; align-items: center; justify-content: flex-end; animation: enter .65s .1s ease-out both; }
.hero-visual::before { content: ""; position: absolute; inset: 12% -20% 8% 1%; border-radius: 44% 0 0 52%; background: rgba(255,255,255,.54); }
.hero-visual img { position: relative; z-index: 1; width: 108%; max-width: none; max-height: 555px; object-fit: contain; mix-blend-mode: multiply; }
.float-card { position: absolute; z-index: 2; padding: 10px 15px; border: 1px solid rgba(255,255,255,.8); border-radius: 10px; background: rgba(255,255,255,.9); box-shadow: 0 10px 30px rgba(18,56,93,.13); color: var(--navy); font-size: 13px; font-weight: 800; }
.card-cycle { right: 7%; top: 20%; }
.card-method { left: 3%; bottom: 18%; }

.collections { background: linear-gradient(#edf8fd, #f8fcfe); padding: 56px 0 72px; }
.section-heading.centered { text-align: center; }
.section-heading h2, .promise h2, .newsletter h2 { margin: 0; color: var(--navy-dark); font-size: clamp(32px, 3vw, 46px); line-height: 1.13; letter-spacing: -.035em; }
.collection-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 36px; }
.collection-card { min-height: 126px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; padding: 25px; background: #fff; border: 1px solid rgba(220,233,240,.9); border-radius: 17px; box-shadow: 0 9px 28px rgba(18,56,93,.07); transition: .22s ease; }
.collection-card:hover { transform: translateY(-4px); box-shadow: 0 16px 38px rgba(18,56,93,.12); }
.collection-icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; font-weight: 900; font-size: 20px; background: #e2f7f5; color: var(--turquoise); }
.collection-icon.timeline { color: var(--blue); background: #e9f3fc; letter-spacing: 3px; }
.collection-icon.training { color: #cb9700; background: #fff5d5; }
.collection-card b, .collection-card small { display: block; }
.collection-card b { color: var(--navy-dark); font-size: 18px; }
.collection-card small { margin-top: 5px; color: var(--muted); font-size: 13px; }
.collection-card i { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--turquoise); color: #fff; font-style: normal; }
.collection-card:nth-child(2) i { background: var(--blue); }
.collection-card:nth-child(3) i { background: var(--yellow); }
.collection-card:nth-child(4) i { background: var(--coral); }
.collection-icon.ief { color: #d45d48; background: #fce9e5; }
.ief-collection { border-color: #f4d6cf; }

.catalogue { padding: 92px 0 105px; }
.section-heading:not(.centered) { display: flex; justify-content: space-between; align-items: end; gap: 50px; }
.section-heading:not(.centered) > p { width: min(430px, 100%); margin: 0 0 4px; color: var(--muted); line-height: 1.65; }
.filter-panel { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 38px; padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: #f7fbfd; }
.filter-panel .search-field { grid-column: 1 / -1; }
.filter-panel label > span { display: block; margin: 0 0 8px 3px; color: var(--navy); font-size: 12px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.filter-panel select, .filter-panel input { width: 100%; height: 50px; border: 1px solid #cddfe8; border-radius: 10px; background: #fff; color: var(--ink); padding: 0 15px; outline: none; transition: .2s ease; }
.filter-panel select:focus, .filter-panel input:focus { border-color: var(--turquoise); box-shadow: 0 0 0 3px rgba(33,183,174,.13); }
.results-bar { min-height: 60px; display: flex; justify-content: space-between; align-items: center; color: var(--muted); }
.results-bar b { color: var(--navy); }
.results-bar button { border: 0; background: none; color: var(--blue); font-weight: 800; cursor: pointer; }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 23px; }
.product-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 7px 24px rgba(18,56,93,.06); transition: transform .22s ease, box-shadow .22s ease; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 16px 35px rgba(18,56,93,.12); }
.product-visual { height: 185px; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; background: #e7f7f5; }
.product-visual::before, .product-visual::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255,255,255,.4); }
.product-visual::before { width: 160px; height: 160px; right: -35px; top: -50px; }
.product-visual::after { width: 100px; height: 100px; left: -25px; bottom: -48px; }
.product-visual.blue { background: #e8f3fc; }
.product-visual.coral { background: #fce9e5; }
.product-visual.yellow { background: #fff4d1; }
.product-icon { position: relative; z-index: 1; color: var(--navy); font-size: 58px; font-weight: 900; line-height: 1; }
.product-visual small { position: relative; z-index: 1; margin-top: 14px; color: var(--navy); font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.product-badge { position: absolute; z-index: 2; top: 13px; left: 13px; padding: 7px 9px; border-radius: 7px; background: rgba(255,255,255,.88); color: var(--navy); font-size: 11px; font-weight: 850; }
.product-content { padding: 22px; }
.tags { min-height: 26px; display: flex; flex-wrap: wrap; gap: 6px; }
.tags span { padding: 5px 8px; border-radius: 99px; background: #f0f6f9; color: #48677d; font-size: 10px; font-weight: 800; }
.tags .grand-recit-tag { color: #915040; background: #fcebe7; }
.product-content h3 { margin: 14px 0 8px; color: var(--navy-dark); font-size: 20px; line-height: 1.25; }
.product-content > p { min-height: 66px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.product-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; padding-top: 17px; border-top: 1px solid #eaf0f3; }
.product-footer b { color: var(--navy-dark); font-size: 18px; }
.product-footer a { display: inline-flex; align-items: center; gap: 8px; color: var(--blue); font-size: 14px; font-weight: 850; }
.empty-state { padding: 70px 20px; text-align: center; border: 1px dashed #c8dce6; border-radius: 18px; background: #f8fcfe; }
.empty-state > span { color: var(--turquoise); font-size: 50px; }
.empty-state h3 { margin: 12px 0 6px; color: var(--navy); }
.empty-state p { margin: 0 0 22px; color: var(--muted); }

.promise { padding: 90px 0; color: #fff; background: var(--navy-dark); }
.promise .eyebrow { color: #57d7cf; }
.promise h2 { color: #fff; }
.promise-inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 90px; align-items: center; }
.promise-points { display: grid; gap: 12px; }
.promise-points p { display: grid; grid-template-columns: 52px 1fr; margin: 0; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.promise-points span { grid-row: 1 / 3; color: var(--yellow); font-size: 13px; font-weight: 850; }
.promise-points b { font-size: 17px; }
.promise-points small { margin-top: 5px; color: #b9cede; line-height: 1.5; }
.newsletter { padding: 80px 24px; background: #edf8fd; }
.newsletter-card { width: min(1160px, 100%); margin: auto; padding: 48px 56px; display: grid; grid-template-columns: 1fr .9fr; gap: 55px; align-items: center; border-radius: 22px; background: #fff; box-shadow: 0 12px 38px rgba(18,56,93,.09); }
.newsletter h2 { font-size: clamp(29px, 2.6vw, 40px); }
.newsletter p:not(.eyebrow) { margin: 12px 0 0; color: var(--muted); }
.newsletter form { display: grid; gap: 11px; }
.newsletter input { height: 54px; padding: 0 17px; border: 1px solid #cddfe8; border-radius: 11px; outline: none; }
.newsletter input:focus { border-color: var(--turquoise); box-shadow: 0 0 0 3px rgba(33,183,174,.13); }

footer { padding: 50px 0 25px; color: #d6e5ef; background: #062442; }
footer .brand { color: #fff; }
.footer-inner { display: grid; grid-template-columns: auto 1fr auto; gap: 45px; align-items: center; }
.footer-inner > p { color: #9eb7ca; }
.footer-inner > div { display: flex; gap: 24px; font-weight: 700; font-size: 14px; }
.footer-legal { margin-top: 35px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); color: #7f9bb0; font-size: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@keyframes enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

/* Espace familles IEF */
.ief-page { min-height: 100vh; background: #f3f8fb; }
.ief-topbar { height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 38px; border-bottom: 1px solid var(--line); background: #fff; }
.ief-topbar > div { display: flex; align-items: center; gap: 22px; }
.secure-label { padding: 8px 12px; border-radius: 99px; color: #117f79; background: #e2f7f5; font-size: 12px; font-weight: 850; }
.back-link { color: var(--blue); font-size: 14px; font-weight: 800; }
.ief-shell { display: grid; grid-template-columns: 270px minmax(0, 1fr); min-height: calc(100vh - 78px); }
.ief-sidebar { padding: 30px 20px; border-right: 1px solid var(--line); background: #fff; }
.sidebar-title { margin: 0 12px 14px; color: #8ba0b0; font-size: 11px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.ief-sidebar > button, #sideNav > button { width: 100%; min-height: 46px; display: flex; align-items: center; gap: 12px; margin: 4px 0; padding: 0 13px; border: 0; border-radius: 9px; color: #49687d; background: transparent; text-align: left; font-size: 14px; font-weight: 750; cursor: pointer; }
.ief-sidebar > button span, #sideNav > button span { width: 25px; color: #8aa2b3; text-align: center; font-weight: 900; }
.ief-sidebar > button:hover, .ief-sidebar > button.active, #sideNav > button:hover, #sideNav > button.active { color: var(--navy); background: #eaf7fd; }
.ief-sidebar > button.active span, #sideNav > button.active span { color: var(--turquoise); }
.sidebar-help { margin-top: 35px; padding: 20px; border-radius: 14px; color: #fff; background: var(--navy-dark); }
.sidebar-help b { font-size: 14px; }
.sidebar-help p { margin: 8px 0 15px; color: #b9cede; font-size: 12px; line-height: 1.5; }
.sidebar-help a { color: #63ddd5; font-size: 12px; font-weight: 850; }
.ief-main { width: min(1120px, calc(100% - 50px)); margin: 0 auto; padding: 45px 0 80px; }
.ief-welcome { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.ief-welcome h1 { max-width: none; font-size: clamp(36px, 4vw, 55px); }
.ief-welcome > div > p:last-child { margin: 12px 0 0; color: var(--muted); font-size: 17px; }
.progress-ring { --progress: 90deg; width: 105px; height: 105px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--turquoise) var(--progress), #dfeef3 0); }
.progress-ring::before { content: ""; grid-area: 1/1; width: 78px; height: 78px; border-radius: 50%; background: #f3f8fb; }
.progress-ring span { z-index: 1; grid-area: 1/1; text-align: center; }
.progress-ring b, .progress-ring small { display: block; }
.progress-ring b { color: var(--navy); font-size: 20px; }
.progress-ring small { color: var(--muted); font-size: 10px; }
.ief-alert { display: flex; align-items: center; gap: 15px; margin: 28px 0 22px; padding: 14px 18px; border: 1px solid #cce7f5; border-radius: 12px; background: #eaf7fd; }
.ief-alert > span { width: 27px; height: 27px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--blue); font-weight: 900; }
.ief-alert p { margin: 0; color: #45687d; font-size: 12px; line-height: 1.5; }
.ief-dashboard-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 20px; }
.dashboard-card, .ief-paths { padding: 25px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 7px 22px rgba(18,56,93,.05); }
.card-title { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.card-title .eyebrow { margin-bottom: 5px; font-size: 10px; }
.card-title h2, .learning-note h2 { margin: 0; color: var(--navy-dark); font-size: 21px; }
.card-title > span { padding: 6px 9px; border-radius: 99px; color: #976044; background: #fff1e9; font-size: 10px; font-weight: 850; }
.task-list { margin-top: 17px; }
.task { min-height: 61px; display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 11px; border-top: 1px solid #edf2f4; cursor: pointer; }
.task:first-child { border-top: 0; }
.task input { position: absolute; opacity: 0; }
.custom-check { width: 21px; height: 21px; display: grid; place-items: center; border: 1.5px solid #bed0da; border-radius: 6px; color: transparent; font-size: 12px; }
.task.done .custom-check { color: #fff; border-color: var(--turquoise); background: var(--turquoise); }
.task b, .task small { display: block; }
.task b { color: var(--navy); font-size: 13px; }
.task small { margin-top: 3px; color: #8ba0af; font-size: 10px; }
.task.done b { color: #8ca0ad; text-decoration: line-through; }
.task time { color: #718999; font-size: 10px; font-weight: 800; }
.calendar-card .card-title button { width: 32px; height: 32px; border: 0; border-radius: 50%; color: #fff; background: var(--blue); cursor: pointer; }
.mini-calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: 19px; }
.mini-calendar b, .mini-calendar span { aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; font-size: 10px; }
.mini-calendar b { color: #9aadb9; }
.mini-calendar span { position: relative; color: #4c687a; }
.mini-calendar span.today { color: #fff; background: var(--turquoise); font-weight: 900; }
.mini-calendar span.has-event::after { content: ""; position: absolute; bottom: 2px; width: 4px; height: 4px; border-radius: 50%; background: var(--coral); }
.calendar-card > a { display: block; margin-top: 15px; color: var(--blue); text-align: right; font-size: 11px; font-weight: 850; }
.ief-paths { margin-top: 20px; }
.path-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 18px; }
.path-grid article { min-height: 190px; position: relative; padding: 20px; border-radius: 13px; background: #f6fafc; }
.path-grid article > span { color: var(--coral); font-size: 12px; font-weight: 900; }
.path-grid h3 { margin: 13px 0 8px; color: var(--navy); font-size: 16px; }
.path-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.path-grid a { position: absolute; left: 20px; bottom: 18px; color: var(--blue); font-size: 11px; font-weight: 850; }
.learning-note { display: grid; grid-template-columns: .8fr 1.2fr; gap: 45px; align-items: center; margin-top: 20px; }
.learning-note > div > p:not(.eyebrow) { margin: 9px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.learning-note > div:last-child { display: grid; gap: 10px; }
.learning-note textarea { width: 100%; min-height: 105px; padding: 14px; resize: vertical; border: 1px solid #cddfe8; border-radius: 10px; outline: none; }
.learning-note textarea:focus { border-color: var(--turquoise); box-shadow: 0 0 0 3px rgba(33,183,174,.13); }
.learning-note .button { justify-self: end; min-height: 44px; font-size: 13px; }

@media (max-width: 1080px) {
  .header-inner { height: 74px; }
  .menu-button { display: grid; gap: 5px; }
  .menu-button span { width: 25px; height: 2px; background: var(--navy); }
  .nav { display: none; position: absolute; top: 74px; left: 0; right: 0; padding: 10px 24px 24px; flex-direction: column; align-items: stretch; gap: 0; background: #fff; box-shadow: 0 15px 25px rgba(18,56,93,.1); }
  .nav.open { display: flex; }
  .nav a { padding: 14px 0; }
  .nav a::after { display: none; }
  .hero-inner { grid-template-columns: 1fr 1fr; }
  .hero-actions { align-items: stretch; flex-direction: column; width: fit-content; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .collection-grid { grid-template-columns: repeat(2, 1fr); }
  .ief-shell { grid-template-columns: 220px minmax(0, 1fr); }
}

@media (max-width: 760px) {
  .header-inner, .hero-inner, .section-inner, .footer-inner, .footer-legal { width: min(100% - 32px, 1320px); }
  .brand { font-size: 18px; }
  .hero-inner { display: flex; min-height: 0; flex-direction: column; }
  .hero-copy { padding: 58px 0 24px; }
  h1 { font-size: clamp(45px, 13vw, 62px); }
  .hero-actions { width: 100%; }
  .hero-actions .button { width: 100%; }
  .hero-proof { flex-wrap: wrap; gap: 9px 17px; }
  .hero-visual { height: 330px; width: 100%; }
  .hero-visual img { width: 115%; max-height: 360px; }
  .float-card { font-size: 11px; }
  .collection-grid, .product-grid, .filter-panel, .promise-inner, .newsletter-card { grid-template-columns: 1fr; }
  .collections, .catalogue, .promise { padding-block: 66px; }
  .section-heading:not(.centered) { align-items: start; flex-direction: column; gap: 15px; }
  .collection-card { min-height: 110px; }
  .filter-panel { gap: 14px; padding: 16px; }
  .product-content > p { min-height: 0; }
  .promise-inner { gap: 40px; }
  .newsletter { padding: 55px 16px; }
  .newsletter-card { padding: 32px 24px; gap: 30px; }
  .footer-inner { grid-template-columns: 1fr; gap: 20px; }
  .footer-inner > div { flex-wrap: wrap; }
  .ief-topbar { height: auto; padding: 16px; gap: 14px; }
  .ief-topbar .brand { font-size: 16px; }
  .ief-topbar > div { gap: 10px; }
  .secure-label { display: none; }
  .ief-shell { display: block; }
  .ief-sidebar { display: flex; overflow-x: auto; gap: 6px; padding: 12px 16px; border-right: 0; border-bottom: 1px solid var(--line); }
  .ief-sidebar .sidebar-title, .sidebar-help { display: none; }
  .ief-sidebar > button { width: auto; flex: 0 0 auto; padding: 0 12px; }
  .ief-main { width: min(100% - 28px, 1120px); padding-top: 30px; }
  .ief-welcome { align-items: start; }
  .ief-welcome h1 { font-size: 36px; }
  .progress-ring { width: 78px; height: 78px; }
  .progress-ring::before { width: 58px; height: 58px; }
  .progress-ring b { font-size: 15px; }
  .ief-dashboard-grid, .path-grid, .learning-note { grid-template-columns: 1fr; }
  .learning-note { gap: 22px; }
  .learning-note .button { justify-self: stretch; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}