/* Master ISC — styles inspirés de la brochure fournie */
:root {
    --navy:#092d56;
    --navy-2:#0c3c6c;
    --blue:#174d7c;
    --gold:#d7ad35;
    --ink:#122b49;
    --muted:#63758a;
    --paper:#fff;
    --mist:#f1f5f8;
    --line:#e2e9ef;
    --radius:18px;
    --shadow:0 18px 50px rgba(5,35,65,.12)
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:86px
}
body {
    margin:0;
    color:var(--ink);
    font-family:"DM Sans",sans-serif;
    line-height:1.6;
    background:#fff
}
a {
    color:inherit;
    text-decoration:none
}
button {
    font:inherit
}
/* 1. En-tête et navigation */
.site-header {
    height:82px;
    padding:0 clamp(22px,6vw,96px);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
    background:#fff;
    position:sticky;
    top:0;
    z-index:50;
    box-shadow:0 3px 20px rgba(6,38,68,.06)
}
.brand {
    display:flex;
    align-items:center;
    gap:11px;
    flex-shrink:0
}
.brand-mark {
    height:43px;
    width:43px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--navy);
    color:white;
    font-family:Montserrat,sans-serif;
    font-weight:800;
    font-size:18px;
    letter-spacing:-2px
}
.brand-logo {
    display:block;
    width:auto;
    height:43px;
    max-width:210px;
    object-fit:contain
}
.brand-name {
    font-size:10px;
    font-weight:800;
    line-height:1.25;
    letter-spacing:.04em
}
.main-nav {
    display:flex;
    align-items:center;
    gap:clamp(18px,2.6vw,42px);
    font-size:13px;
    font-weight:700
}
.main-nav>a:not(.nav-cta) {
    transition:color .2s
}
.main-nav>a:hover {
    color:#b18a1b
}
.nav-cta {
    padding:12px 18px;
    background:var(--navy);
    color:white;
    border-radius:5px
}
.nav-cta span {
    color:var(--gold);
    padding-left:8px
}
.menu-toggle {
    display:none;
    border:0;
    background:none;
    padding:8px
}
.menu-toggle span {
    display:block;
    width:25px;
    height:2px;
    background:var(--navy);
    margin:5px
}
/* 2. Bannière principale */
.hero {
    position:relative;
    min-height:660px;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:var(--navy);
    color:#fff
}
.hero-image {
    position:absolute;
    inset:0 0 0 24%;
    background:url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=2000&q=85") center/cover no-repeat;
    opacity:.9
}
.hero-shade {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#06264b 0%,rgba(6,38,75,.96) 26%,rgba(6,38,75,.72) 52%,rgba(6,38,75,.18) 100%),linear-gradient(0deg,rgba(5,31,59,.62),transparent 50%)
}
.hero-content {
    position:relative;
    z-index:2;
    width:min(780px,70%);
    padding:80px clamp(24px,8vw,130px)
}
.eyebrow {
    margin:0 0 18px;
    text-transform:uppercase;
    letter-spacing:.14em;
    font-size:11px;
    font-weight:800;
    color:#d4b14a;
    display:flex;
    align-items:center;
    gap:12px
}
.eyebrow-line {
    display:inline-block;
    width:32px;
    height:2px;
    background:var(--gold)
}
.eyebrow.dark {
    color:#8a6b16
}
.hero-kicker {
    font-size:clamp(27px,4vw,48px);
    font-weight:400;
    margin:28px 0 -12px;
    letter-spacing:-.04em
}
.hero h1 {
    font-family:Montserrat,sans-serif;
    font-size:clamp(42px,6.5vw,86px);
    line-height:1.06;
    letter-spacing:-.055em;
    margin:12px 0 20px;
    font-weight:500
}
.hero h1 strong {
    font-weight:800
}
.hero-lead {
    font-size:clamp(16px,2vw,21px);
    max-width:440px;
    color:#e1eaf3;
    margin-bottom:30px
}
.hero-actions {
    display:flex;
    gap:12px;
    flex-wrap:wrap
}
.button {
    min-height:48px;
    padding:13px 19px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.01em;
    border-radius:4px;
    transition:transform .2s,background .2s
}
.button:hover {
    transform:translateY(-2px)
}
.button-gold {
    background:var(--gold);
    color:#102c4d
}
.button-gold span {
    font-size:18px
}
.button-glass {
    border:1px solid rgba(255,255,255,.55);
    color:white;
    background:rgba(255,255,255,.08)
}
.hero-bottom {
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    margin-top:60px;
    color:#d9e4ef;
    font-size:11px
}
.hero-bottom span+span {
    border-left:1px solid rgba(255,255,255,.35);
    padding-left:20px
}
.hero-stamp {
    position:absolute;
    right:7%;
    bottom:12%;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    color:white;
    text-align:center
}
.hero-stamp>span {
    width:105px;
    height:105px;
    border:1px solid rgba(255,255,255,.7);
    border-radius:50%;
    display:grid;
    place-items:center;
    font:800 30px Montserrat;
    letter-spacing:-.08em
}
.hero-stamp small {
    font-size:10px;
    line-height:1.4;
    letter-spacing:.06em;
    text-transform:uppercase
}
/* 3. Espacements et styles communs des sections */
.section {
    padding:100px clamp(22px,7.5vw,120px)
}
.section-tinted {
    background:var(--mist)
}
.maquette-layout {
    display:grid;
    grid-template-columns:7fr 3fr;
    gap:38px;
    align-items:stretch
}
.maquette-layout iframe {
    display:block;
    width:100%;
    height:600px;
    border:1px solid lightgray
}
.maquette-summary {
    padding:34px 30px;
    background:#fff;
    border:1px solid #e3e9ee
}
.maquette-summary h3 {
    margin:14px 0 18px;
    color:var(--navy);
    font:700 22px/1.25 Montserrat,sans-serif;
    letter-spacing:-.03em
}
.maquette-summary p,
.maquette-summary li {
    color:var(--muted);
    font-size:15px;
    line-height:1.65
}
.maquette-summary ul {
    margin:22px 0;
    padding-left:20px
}
/* 4. Titres de section et introduction */
.section-heading {
    display:flex;
    align-items:flex-start;
    gap:22px;
    margin-bottom:38px
}
.section-number {
    font-family:Montserrat,sans-serif;
    font-size:54px;
    line-height:1;
    color:#d8e0e8;
    font-weight:500;
    letter-spacing:-.07em
}
.section-heading h2,.campus-copy h2,.video-copy h2 {
    font:700 clamp(28px,3.6vw,44px)/1.15 Montserrat,sans-serif;
    letter-spacing:-.05em;
    margin:0;
    color:var(--navy)
}
.section-heading .eyebrow {
    margin-bottom:10px
}
.intro-grid {
    display:grid;
    grid-template-columns:1fr .9fr;
    gap:70px;
    align-items:stretch
}
.intro-copy {
    padding:6px 0 0 78px;
    max-width:650px
}
.lead {
    font-size:clamp(19px,2.2vw,25px);
    line-height:1.4;
    color:var(--navy);
    font-weight:600;
    margin-top:0
}
.intro-copy>p:not(.lead) {
    color:var(--muted);
    font-size:15px;
    max-width:590px
}
.text-link {
    display:inline-flex;
    gap:24px;
    align-items:center;
    color:var(--navy);
    font-weight:800;
    font-size:12px;
    margin-top:18px;
    border-bottom:1px solid var(--gold);
    padding-bottom:8px
}
.text-link span {
    font-size:20px;
    color:#b48b1c
}
.feature-panel {
    background:var(--navy);
    padding:30px clamp(22px,4vw,54px);
    color:white;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:26px;
    border-radius:5px;
    position:relative;
    overflow:hidden
}
.feature-panel:after {
    content:"";
    position:absolute;
    width:240px;
    height:240px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:50%;
    right:-110px;
    bottom:-130px;
    box-shadow:0 0 0 30px rgba(255,255,255,.025),0 0 0 60px rgba(255,255,255,.02)
}
.feature-item {
    display:flex;
    gap:13px;
    position:relative;
    z-index:1
}
.feature-icon {
    font-size:27px;
    color:var(--gold);
    line-height:1.2
}
.feature-item h3 {
    font-size:13px;
    margin:0 0 6px
}
.feature-item p {
    font-size:11px;
    color:#c5d4e3;
    margin:0;
    line-height:1.5
}
/* 5. Cartes des trois parcours */
.section-intro {
    color:var(--muted);
    max-width:650px;
    margin:-18px 0 34px 76px
}
.pathway-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px
}
.pathway-card {
    min-height:310px;
    border-radius:9px;
    overflow:hidden;
    position:relative;
    color:#fff;
    display:flex;
    align-items:flex-end;
    isolation:isolate;
    box-shadow:var(--shadow);
    transition:transform .25s
}
.pathway-card:hover {
    transform:translateY(-5px)
}
.pathway-card:before {
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background-size:cover;
    background-position:center;
    transition:transform .5s
}
.pathway-card:hover:before {
    transform:scale(1.04)
}
.pathway-card:after {
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(0deg,rgba(3,26,52,.98) 0%,rgba(5,39,71,.83) 55%,rgba(4,35,66,.1) 100%)
}
.pathway-cometes:before {
    background-image:url("https://images.unsplash.com/photo-1565043666747-69f6646db940?auto=format&fit=crop&w=900&q=80")
}
.pathway-sms:before {
    background-image:url("https://images.unsplash.com/photo-1581092921461-eab62e97a780?auto=format&fit=crop&w=900&q=80")
}
.pathway-reset:before {
    background-image:url("https://images.unsplash.com/photo-1470071459604-3b5ec3a7fe05?auto=format&fit=crop&w=900&q=80")
}
.pathway-art {
    position:absolute;
    top:25px;
    right:25px;
    width:80px;
    height:80px;
    border:1px solid rgba(255,255,255,.45);
    border-radius:50%;
    display:grid;
    place-items:center
}
.art-symbol {
    font-size:36px;
    color:white
}
.art-orbit {
    position:absolute;
    width:105px;
    height:35px;
    border:1px solid rgba(255,255,255,.4);
    border-radius:50%;
    transform:rotate(-42deg)
}
.pathway-content {
    padding:28px;
    max-width:390px
}
.card-index {
    font-size:9px;
    letter-spacing:.16em;
    font-weight:800;
    color:#d7b348
}
.pathway-content h3 {
    font:800 28px Montserrat;
    margin:8px 0 7px;
    letter-spacing:-.04em
}
.pathway-content p {
    font-size:13px;
    color:#e1eaf2;
    max-width:290px;
    min-height:42px;
    margin:0 0 20px
}
.pathway-content a {
    font-size:11px;
    font-weight:800;
    border-top:1px solid rgba(255,255,255,.35);
    padding-top:12px;
    display:flex;
    justify-content:space-between
}
.pathway-content a span {
    color:var(--gold);
    font-size:17px
}
/* 6. Organisation du master : M1 et M2 */
.organisation-layout {
    display:grid;
    grid-template-columns:.8fr 1.3fr .75fr;
    gap:18px;
    align-items:stretch
}
.hours-card {
    background:var(--navy);
    color:#fff;
    padding:30px;
    border-radius:7px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:22px
}
.hours-card>div {
    display:flex;
    align-items:baseline;
    gap:10px
}
.hours-number {
    font:700 clamp(27px,3vw,38px) Montserrat;
    letter-spacing:-.05em
}
.hours-label {
    font-size:13px;
    color:#c8d6e4
}
.hours-note {
    font-size:10px;
    color:#afc1d3;
    margin:4px 0 0
}
.common-core {
    padding:28px;
    background:#f4f7fa;
    border:1px solid var(--line);
    border-radius:7px
}
.common-header {
    display:flex;
    gap:13px;
    align-items:center;
    margin-bottom:20px
}
.common-icon {
    width:44px;
    height:44px;
    border-radius:50%;
    background:#e4ebf2;
    display:grid;
    place-items:center;
    color:var(--navy);
    font-size:22px
}
.common-header h3 {
    margin:2px 0 0;
    font:700 19px Montserrat
}
.common-header .card-index {
    color:#9a791c
}
.topic-list {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px 18px
}
.topic-list>div {
    font-size:12px;
    line-height:1.4;
    display:flex;
    gap:9px;
    align-items:flex-start
}
.topic-list>div span {
    font-size:9px;
    font-weight:800;
    color:#b18b21;
    margin-top:3px
}
.specialisation-note {
    background:#f8f2df;
    padding:25px 20px;
    border-radius:7px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:12px
}
.note-icon {
    font-size:30px;
    color:#aa861b
}
.specialisation-note p {
    font-size:13px;
    margin:0
}
.specialisation-note strong {
    color:var(--navy)
}
/* 7. Section vidéo */
.video-section {
    background:var(--navy);
    color:white;
    position:relative;
    overflow:hidden
}
.video-bg {
    position:absolute;
    inset:0 0 0 38%;
    background:linear-gradient(90deg,var(--navy),rgba(5,39,72,.35)),url("https://images.unsplash.com/photo-1581092580497-e0d23cbdf1dc?auto=format&fit=crop&w=1600&q=85") center/cover;
    opacity:.75
}
.video-inner {
    position:relative;
    display:grid;
    grid-template-columns:.7fr 1.3fr;
    align-items:center;
    gap:55px;
    padding:95px clamp(22px,7.5vw,120px)
}
.video-copy h2 {
    color:#fff;
    font-size:clamp(32px,4vw,50px)
}
.video-copy h2 em {
    font-style:normal;
    color:var(--gold)
}
.video-copy>p:not(.eyebrow) {
    font-size:14px;
    color:#cbd9e6;
    max-width:360px;
    margin:20px 0 26px
}
.video-preview {
    border:1px solid rgba(255,255,255,.45);
    border-radius:10px;
    aspect-ratio:16/9;
    position:relative;
    overflow:hidden;
    cursor:pointer;
    color:white;
    background:linear-gradient(0deg,rgba(5,29,53,.75),rgba(5,29,53,.05)),url("../media/IISC.png") center/cover;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    text-align:left;
    padding:25px
}
.video-preview:after {
    content:"";
    position:absolute;
    inset:0;
    background:rgba(5,37,70,.08);
    transition:background .2s
}
.video-preview:hover:after {
    background:rgba(5,37,70,.3)
}
.video-preview-label,.video-preview-bottom {
    position:relative;
    z-index:1;
    font-size:10px;
    letter-spacing:.12em;
    font-weight:800
}
.video-preview-bottom {
    display:flex;
    justify-content:space-between;
    gap:12px;
    letter-spacing:0;
    font-size:11px
}
.play-button {
    position:absolute;
    z-index:2;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    height:72px;
    width:72px;
    border-radius:50%;
    background:var(--gold);
    display:grid;
    place-items:center;
    box-shadow:0 0 0 12px rgba(215,173,53,.18);
    color:var(--navy)
}
.play-button span {
    font-size:23px;
    margin-left:4px
}
/* 8. Débouchés et métiers */
.sector-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-bottom:38px
}
.sector {
    border:1px solid var(--line);
    padding:28px 18px;
    text-align:center;
    border-radius:7px;
    transition:box-shadow .2s,transform .2s
}
.sector:hover {
    box-shadow:var(--shadow);
    transform:translateY(-3px)
}
.sector-icon {
    width:62px;
    height:62px;
    border-radius:50%;
    background:var(--navy);
    color:white;
    display:grid;
    place-items:center;
    margin:0 auto 16px;
    font-size:27px
}
.sector h3,.sector p {
    margin:0;
    font-size:13px
}
.sector h3 {
    font-weight:800
}
.sector p {
    color:var(--muted);
    font-size:11px
}
.jobs-panel {
    background:#edf3f8;
    border-radius:10px;
    display:grid;
    grid-template-columns:1fr .85fr;
    overflow:hidden;
    min-height:310px
}
.jobs-panel>div:first-child {
    padding:35px 40px
}
.jobs-panel h3 {
    font:700 23px/1.25 Montserrat;
    max-width:400px;
    margin:0 0 18px
}
.jobs-panel ul {
    padding-left:18px;
    color:#52667b;
    font-size:12px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px 18px
}
.jobs-visual {
    background:linear-gradient(0deg,rgba(5,35,65,.25),rgba(5,35,65,.05)),url("https://images.unsplash.com/photo-1581091226825-a6a2a5aee158?auto=format&fit=crop&w=1000&q=80") center/cover;
    display:flex;
    align-items:flex-end;
    padding:20px
}
.visual-tag {
    font-size:9px;
    color:#fff;
    letter-spacing:.15em;
    font-weight:800;
    background:rgba(5,35,65,.7);
    padding:8px 10px;
    border-radius:3px
}
/* 9. Présentation du campus */
.campus {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center
}
.campus-photo {
    min-height:470px;
    border-radius:8px;
    background:url("https://images.unsplash.com/photo-1498243691581-b145c3f54a5a?auto=format&fit=crop&w=1200&q=85") center/cover;
    box-shadow:var(--shadow)
}
.campus-copy h2 {
    margin-bottom:20px
}
.campus-copy>p:not(.eyebrow) {
    color:var(--muted);
    font-size:14px
}
.campus-points {
    margin-top:30px;
    display:grid;
    gap:18px
}
.campus-points>div {
    display:flex;
    gap:16px;
    align-items:center
}
.campus-points span {
    width:43px;
    height:43px;
    border-radius:50%;
    background:#fff;
    color:#b28b20;
    display:grid;
    place-items:center;
    font-size:22px;
    flex-shrink:0
}
.campus-points p {
    margin:0;
    font-size:12px;
    color:var(--muted)
}
.campus-points strong {
    color:var(--navy)
}
/* 10. Informations pratiques et candidature */
.practical-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px
}
.info-card {
    display:flex;
    align-items:flex-start;
    gap:17px;
    padding:24px;
    background:#f1f5f8;
    border-radius:7px;
    min-height:125px
}
.info-icon {
    font-size:30px;
    color:var(--navy);
    line-height:1.2
}
.info-card h3 {
    font:700 15px Montserrat;
    margin:0 0 5px
}
.info-card p {
    font-size:12px;
    margin:0;
    line-height:1.6
}
.info-card p span {
    color:var(--muted)
}
.apply-banner {
    background:var(--navy);
    color:white;
    margin-top:45px;
    padding:35px 40px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    border-radius:7px
}
.apply-label {
    font-size:9px;
    letter-spacing:.15em;
    color:var(--gold);
    font-weight:800
}
.apply-banner h2 {
    font:700 clamp(20px,2.5vw,30px)/1.25 Montserrat;
    margin:8px 0 0;
    max-width:620px
}
/* 11. Pourquoi choisir le master et statistiques */
.why-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px 45px
}
.why-grid article {
    display:flex;
    gap:18px;
    align-items:flex-start
}
.why-grid article>span {
    font-size:29px;
    color:#b18a1d;
    line-height:1
}
.why-grid h3 {
    font:700 15px Montserrat;
    margin:0 0 6px
}
.why-grid p {
    font-size:13px;
    color:var(--muted);
    margin:0
}
.stats-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,280px));
    gap:18px
}
.stat-card {
    background:#f1f5f8;
    padding:28px 24px;
    text-align:center;
    border-radius:8px;
    display:flex;
    align-items:center;
    flex-direction:column
}
.stat-icon {
    font-size:26px;
    color:var(--navy)
}
.stat-card strong {
    font:800 35px Montserrat;
    color:var(--navy);
    letter-spacing:-.05em;
    margin:8px 0
}
.stat-card p {
    font-size:13px;
    line-height:1.5;
    margin:0
}
.stat-card small {
    font-size:10px;
    color:var(--muted);
    margin-top:9px
}
.disclaimer {
    font-size:10px;
    color:#8795a3;
    margin-top:18px
}
.tuition-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px
}
.tuition-card {
    background:#e9f1f7;
    border-radius:8px;
    padding:28px 24px;
    text-align:center;
    color:var(--navy)
}
.tuition-card-international {
    background:#f8efd9
}
.tuition-icon {
    display:block;
    font-size:30px;
    margin-bottom:10px
}
.tuition-card h3 {
    font:700 15px/1.35 Montserrat;
    min-height:42px;
    margin:0 auto 12px;
    max-width:240px
}
.tuition-card strong {
    display:block;
    font:800 32px Montserrat;
    margin-bottom:4px
}
.tuition-card p {
    margin:0;
    font-size:12px
}
/* 12. Pied de page */
.site-footer {
    background:#061f3c;
    color:white;
    padding:35px clamp(22px,7.5vw,120px);
    display:flex;
    align-items:center;
    gap:25px;
    flex-wrap:wrap
}
.footer-brand .brand-mark {
    background:white;
    color:var(--navy)
}
.footer-brand .brand-logo {
    filter:invert(1);
}
.site-footer>p {
    font-size:12px;
    color:#c4d2e0;
    margin-right:auto
}
.site-footer>a:not(.brand) {
    font-size:11px;
    color:#e5c45f
}
.site-footer>small {
    width:100%;
    border-top:1px solid rgba(255,255,255,.15);
    padding-top:17px;
    color:#8ea5bc;
    font-size:10px
}
/* 13. Fenêtre modale de la vidéo */
.video-modal {
    position:fixed;
    inset:0;
    z-index:100;
    background:rgba(1,13,27,.86);
    display:none;
    place-items:center;
    padding:20px
}
.video-modal.is-open {
    display:grid
}
.video-modal-panel {
    width:min(900px,100%);
    position:relative;
    background:#071f3b;
    border-radius:10px;
    overflow:hidden
}
.video-close {
    position:absolute;
    top:10px;
    right:14px;
    z-index:5;
    background:rgba(255,255,255,.15);
    border:0;
    color:white;
    font-size:30px;
    width:42px;
    height:42px;
    border-radius:50%;
    cursor:pointer
}
.video-placeholder {
    aspect-ratio:16/9;
    display:flex;
    flex-direction:column;
    /* align-items:center; */
    justify-content:center;
    text-align:center;
    padding:30px;
    color:white;
    background:radial-gradient(circle at 50% 40%,#174d7c,#061c36 70%)
}
.video-placeholder .play-button {
    position:static;
    transform:none;
    margin-bottom:25px
}
.video-placeholder h3 {
    font:700 22px Montserrat;
    margin:0 0 10px
}
.video-placeholder p {
    max-width:520px;
    font-size:13px;
    color:#c8d7e5;
    margin:0
}
.video-placeholder code {
    color:#f0ce66
}
.video-placeholder video,
.video-placeholder iframe {
    display:block;
    width:100%;
    height:100%;
    min-height:0;
    border:0;
    object-fit:contain
}
/* 14. Adaptation aux écrans moyens */
@media(max-width:1000px) {
    .main-nav {
        gap:15px
    }
    .main-nav>a {
        font-size:11px
    }
    .hero-content {
        width:80%;
        padding-left:7vw
    }
    .hero-stamp {
        right:4%;
        transform:scale(.85)
    }
    .intro-grid {
        gap:35px
    }
    .intro-copy {
        padding-left:0
    }
    .feature-panel {
        padding:25px 20px
    }
/* 6. Organisation du master : M1 et M2 */
    .organisation-layout {
        grid-template-columns:.7fr 1.3fr
    }
    .specialisation-note {
        grid-column:1/-1;
        flex-direction:row;
        align-items:center
    }
    .video-inner {
        gap:30px
    }
/* 3. Espacements et styles communs des sections */
    .section {
        padding-top:75px;
        padding-bottom:75px
    }
}
/* 15. Adaptation aux tablettes et mobiles */
@media(max-width:760px) {
/* 1. En-tête et navigation */
    .site-header {
        height:70px;
        padding:0 20px
    }
    .menu-toggle {
        display:block;
        z-index:52
    }
    .main-nav {
        display:none;
        position:absolute;
        left:0;
        right:0;
        top:70px;
        background:#fff;
        padding:20px;
        box-shadow:0 15px 20px rgba(6,38,68,.1);
        align-items:stretch;
        flex-direction:column;
        gap:0
    }
    .main-nav.is-open {
        display:flex
    }
    .main-nav>a {
        padding:13px 8px;
        font-size:13px
    }
    .main-nav .nav-cta {
        margin-top:8px;
        text-align:center
    }
/* 2. Bannière principale */
    .hero {
        min-height:670px;
        align-items:flex-start
    }
    .hero-image {
        inset:0;
        background-position:60% center
    }
    .hero-shade {
        background:linear-gradient(90deg,rgba(5,33,64,.97),rgba(5,33,64,.72)),linear-gradient(0deg,rgba(5,33,64,.6),transparent)
    }
    .hero-content {
        width:100%;
        padding:75px 24px 30px
    }
    .hero-kicker {
        margin-top:20px
    }
    .hero h1 {
        font-size:clamp(39px,11vw,65px)
    }
    .hero-stamp {
        display:none
    }
    .hero-bottom {
        gap:10px;
        margin-top:42px;
        flex-direction:column
    }
    .hero-bottom span+span {
        border:0;
        padding-left:0
    }
/* 3. Espacements et styles communs des sections */
    .section {
        padding:65px 22px
    }
/* 4. Titres de section et introduction */
    .section-heading {
        gap:13px;
        margin-bottom:28px
    }
    .section-number {
        font-size:39px
    }
    .section-heading h2 {
        font-size:clamp(25px,7vw,35px)
    }
    .intro-grid,.campus,.video-inner {
        grid-template-columns:1fr;
        gap:28px
    }
    .maquette-layout {
        grid-template-columns:1fr;
        gap:24px
    }
    .maquette-layout iframe {
        height:520px
    }
    .intro-copy {
        padding:0
    }
    .feature-panel {
        grid-template-columns:1fr 1fr
    }
    .pathway-grid {
        grid-template-columns:1fr
    }
    .pathway-card {
        min-height:290px
    }
/* 5. Cartes des trois parcours */
    .section-intro {
        margin:0 0 28px
    }
/* 6. Organisation du master : M1 et M2 */
    .organisation-layout {
        grid-template-columns:1fr
    }
    .hours-card {
        flex-direction:row;
        flex-wrap:wrap;
        justify-content:space-between;
        gap:14px
    }
    .hours-note {
        width:100%
    }
    .topic-list {
        grid-template-columns:1fr 1fr
    }
    .specialisation-note {
        grid-column:auto
    }
    .video-bg {
        inset:0;
        background:linear-gradient(90deg,rgba(5,39,72,.94),rgba(5,39,72,.8)),url("https://images.unsplash.com/photo-1581092580497-e0d23cbdf1dc?auto=format&fit=crop&w=1000&q=80") center/cover
    }
    .video-inner {
        padding-top:65px;
        padding-bottom:65px
    }
    .video-preview {
        min-height:250px
    }
/* 8. Débouchés et métiers */
    .sector-grid {
        grid-template-columns:1fr 1fr;
        gap:12px
    }
    .sector {
        padding:20px 10px
    }
    .jobs-panel {
        grid-template-columns:1fr
    }
    .jobs-visual {
        min-height:220px;
        order:-1
    }
    .jobs-panel>div:first-child {
        padding:28px 23px
    }
    .jobs-panel ul {
        grid-template-columns:1fr
    }
    .campus-photo {
        min-height:300px;
        order:0
    }
    .practical-grid,.why-grid {
        grid-template-columns:1fr
    }
    .apply-banner {
        align-items:flex-start;
        flex-direction:column;
        padding:28px 24px
    }
    .stats-grid {
        grid-template-columns:1fr 1fr;
        gap:12px
    }
    .stat-card {
        padding:22px 12px
    }
    .stat-card strong {
        font-size:29px
    }
/* 12. Pied de page */
    .site-footer {
        gap:16px
    }
    .site-footer>p {
        width:100%;
        order:3;
        margin:0
    }
    .site-footer>a:not(.brand) {
        margin-left:auto
    }
}
/* 16. Adaptation aux petits mobiles */
@media(max-width:420px) {
    .brand-name {
        font-size:9px
    }
    .hero h1 {
        font-size:38px
    }
    .hero-lead {
        font-size:16px
    }
    .hero-actions {
        align-items:stretch;
        flex-direction:column;
        max-width:280px
    }
    .feature-panel {
        grid-template-columns:1fr
    }
    .topic-list {
        grid-template-columns:1fr
    }
    .stats-grid {
        grid-template-columns:1fr
    }
    .tuition-grid {
        grid-template-columns:1fr
    }
    .video-preview-bottom {
        font-size:9px
    }
    .video-preview {
        padding:16px
    }
    .section-number {
        font-size:32px
    }
}
.video-embed {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: #071f3b;
    box-shadow: 0 18px 50px rgba(5, 35, 65, 0.2);
}

.video-embed video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}