/* ABO-ONO — shared professional design system */
:root {
  --abo-navy: #102a43;
  --abo-navy-deep: #081c2e;
  --abo-blue: #175cd3;
  --abo-blue-soft: #eaf2ff;
  --abo-gold: #f4b41a;
  --abo-cream: #f7f9fc;
  --abo-text: #243b53;
  --abo-muted: #66788a;
  --abo-border: #e2e8f0;
  --abo-white: #fff;
  --abo-radius: 16px;
  --abo-shadow: 0 16px 45px rgba(16, 42, 67, .10);
}

html { scroll-behavior: smooth; }

body {
  color: var(--abo-text);
  background: var(--abo-white);
  font-family: "DM Sans", "Roboto", sans-serif;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .sitename {
  color: var(--abo-navy);
  font-family: "Manrope", "Raleway", sans-serif;
  letter-spacing: -.02em;
}

a { text-decoration: none; }

/* Shared header */
.header {
  min-height: 78px;
  background: rgba(255,255,255,.97);
  border-bottom: 1px solid rgba(226,232,240,.8);
  box-shadow: 0 5px 24px rgba(16,42,67,.06);
}

.header .logo .sitename {
  margin: 0;
  color: var(--abo-navy);
  font-size: 1.3rem;
  font-weight: 800;
  letter-spacing: -.04em;
  text-transform: uppercase;
}

.header .logo .sitename::after {
  content: "Complexe scolaire";
  display: block;
  margin-top: 2px;
  color: var(--abo-muted);
  font: 700 .56rem "DM Sans", sans-serif;
  letter-spacing: .14em;
}

.navmenu a { font-weight: 600; }

.navmenu > ul > li > a.active,
.navmenu > ul > li > a:hover {
  color: var(--abo-blue);
}

.header .btn-getstarted {
  padding: 11px 19px;
  border-radius: 8px;
  background: var(--abo-blue);
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(23,92,211,.2);
}

.header .btn-getstarted:hover { background: #0f4db8; }

/* Remove the noisy decorative layer used by old pages */
body:not(.presentation-page) .float-shape { display: none !important; }

/* Inner-page title banner */
.page-title {
  position: relative;
  padding: 76px 0 !important;
  overflow: hidden;
  background:
    linear-gradient(100deg, rgba(8,28,46,.97), rgba(16,42,67,.88)),
    url("../img/portfolio/lycee/image2.jpg") center 38%/cover !important;
}

.page-title::after {
  content: "";
  position: absolute;
  right: -80px;
  bottom: -180px;
  width: 360px;
  height: 360px;
  border: 55px solid rgba(244,180,26,.13);
  border-radius: 50%;
}

.page-title .container { position: relative; z-index: 1; }

.page-title h1 {
  color: #fff;
  font-size: clamp(2.2rem, 4vw, 3.5rem);
  font-weight: 800;
}

.page-title h1::before {
  content: "Complexe scolaire ABO-ONO";
  display: block;
  margin-bottom: 10px;
  color: var(--abo-gold);
  font: 800 .72rem "DM Sans", sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Normalize content rhythm */
body:not(.index-page):not(.presentation-page) main > section {
  position: relative;
  padding-top: 88px !important;
  padding-bottom: 88px !important;
}

body:not(.index-page):not(.presentation-page) main > section:nth-of-type(even) {
  background: var(--abo-cream) !important;
}

.section-title { padding-bottom: 36px; }

.section-title h2,
section > .container > h2,
section .container > .text-center > h2 {
  font-size: clamp(1.9rem, 3vw, 2.65rem);
  font-weight: 800 !important;
}

.section-title h2::after {
  width: 54px;
  height: 3px;
  margin: 14px auto 0;
  border-radius: 2px;
  background: var(--abo-gold);
}

.section-title p, .text-muted { color: var(--abo-muted) !important; }

/* First content block on pages without a page-title */
body:not(.index-page):not(.presentation-page) main > section:first-child,
body:not(.index-page):not(.presentation-page) > section:first-of-type {
  min-height: 540px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: linear-gradient(135deg, var(--abo-cream), #edf4ff) !important;
}

body:not(.index-page):not(.presentation-page) > section:first-of-type h2,
body:not(.index-page):not(.presentation-page) main > section:first-child h2 {
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  font-weight: 800 !important;
  line-height: 1.12;
}

body:not(.index-page):not(.presentation-page) > section:first-of-type img,
body:not(.index-page):not(.presentation-page) main > section:first-child img {
  width: 100% !important;
  max-height: 430px;
  border-radius: 20px !important;
  object-fit: cover;
  box-shadow: var(--abo-shadow) !important;
}

/* Cards */
.card,
section .shadow,
section .shadow-sm,
section .shadow-lg,
.info-item,
.service-item,
.portfolio-content {
  border: 1px solid var(--abo-border) !important;
  border-radius: var(--abo-radius) !important;
  background: #fff;
  box-shadow: 0 8px 28px rgba(16,42,67,.07) !important;
  transition: transform .25s ease, box-shadow .25s ease;
}

.card:hover,
section .shadow:hover,
section .shadow-sm:hover,
.portfolio-content:hover {
  transform: translateY(-5px);
  box-shadow: var(--abo-shadow) !important;
}

.card-header {
  padding: 18px;
  border: 0;
  background: var(--abo-navy) !important;
  color: #fff;
  font-family: "Manrope", sans-serif;
  font-weight: 800;
}

.card-body { padding: 25px; }

.card-text.fs-4,
.text-primary { color: var(--abo-blue) !important; }

/* Buttons and forms */
.btn-primary,
.php-email-form button[type="submit"] {
  padding: 12px 22px;
  border-color: var(--abo-blue);
  border-radius: 8px !important;
  background: var(--abo-blue);
  font-weight: 700;
}

.btn-primary:hover,
.php-email-form button[type="submit"]:hover {
  border-color: #0f4db8;
  background: #0f4db8;
  transform: translateY(-2px);
}

.form-control,
.form-select {
  min-height: 50px;
  padding: 12px 15px;
  border: 1px solid var(--abo-border);
  border-radius: 9px;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--abo-blue);
  box-shadow: 0 0 0 4px rgba(23,92,211,.1);
}

textarea.form-control { min-height: 150px; }

.table {
  overflow: hidden;
  border-radius: 10px;
}

.table > :not(caption) > * > * {
  padding: 13px;
  border-color: var(--abo-border);
}

/* Contact */
.contact iframe {
  height: 360px !important;
  border-radius: var(--abo-radius);
  box-shadow: var(--abo-shadow);
}

.contact .info-item {
  margin-bottom: 16px;
  padding: 22px;
}

.contact .info-item i {
  width: 46px;
  height: 46px;
  display: grid;
  flex: 0 0 46px;
  place-items: center;
  border-radius: 10px;
  background: var(--abo-blue-soft);
  color: var(--abo-blue);
}

.contact .php-email-form { padding: 30px; border-radius: var(--abo-radius); }

/* Portfolio, news and events */
.portfolio .portfolio-filters {
  padding: 7px;
  border: 1px solid var(--abo-border);
  border-radius: 10px;
  background: #fff;
}

.portfolio .portfolio-filters li {
  margin: 0 2px;
  padding: 9px 15px;
  border-radius: 7px;
  font-weight: 700;
}

.portfolio .portfolio-filters li.filter-active {
  background: var(--abo-blue);
  color: #fff;
}

.portfolio-content img { aspect-ratio: 4/3; object-fit: cover; }

/* Homepage clean-up */
.index-page #hero-carousel .carousel-item { min-height: 650px; }
.index-page #hero-carousel .hero-img { min-height: 650px; object-fit: cover; }
.index-page .custom-caption { max-width: 760px; }
.index-page .custom-caption h2 {
  color: #fff;
  font-size: clamp(2.4rem, 5vw, 4.5rem);
  font-weight: 800 !important;
  line-height: 1.08;
}
.index-page main > section { padding-top: 95px !important; padding-bottom: 95px !important; }
.index-page #services { background: var(--abo-navy) !important; }
.index-page #services h2,
.index-page #services h3 { color: #fff; }

/* Footer */
.footer {
  padding-top: 65px !important;
  background: var(--abo-navy-deep) !important;
}

.footer h4, .footer h5 { color: #fff; font-weight: 800; }
.footer p { color: rgba(255,255,255,.68); line-height: 1.7; }
.footer li { margin-bottom: 9px; }
.footer a { color: rgba(255,255,255,.72) !important; }
.footer a:hover { color: var(--abo-gold) !important; padding-left: 3px; }
.footer form { display: none !important; }

@media (max-width: 991px) {
  .header { min-height: 70px; }
  body:not(.index-page):not(.presentation-page) main > section,
  body:not(.index-page):not(.presentation-page) > section { padding: 70px 0 !important; }
  .index-page #hero-carousel .carousel-item,
  .index-page #hero-carousel .hero-img { min-height: 580px; }
}

@media (max-width: 575px) {
  .page-title { padding: 55px 0 !important; }
  .header .btn-getstarted {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    margin-right: 8px;
    padding: 7px 10px;
    font-size: 12px;
    white-space: nowrap;
  }
  body:not(.index-page):not(.presentation-page) main > section,
  body:not(.index-page):not(.presentation-page) > section { padding: 58px 0 !important; }
  body:not(.index-page):not(.presentation-page) main > section:first-child,
  body:not(.index-page):not(.presentation-page) > section:first-of-type { min-height: auto; }
  .index-page #hero-carousel .carousel-item,
  .index-page #hero-carousel .hero-img { min-height: 520px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; }
}

/* ===== Rebuilt homepage ===== */
.brand-logo { width: 46px; height: 46px; margin-right: 10px; object-fit: contain; }
.home-hero { position: relative; min-height: 720px; overflow: hidden; color: #fff; background: var(--abo-navy-deep); }
.home-hero-media { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(6,23,38,.97) 0%, rgba(6,23,38,.83) 52%, rgba(6,23,38,.28) 100%), url("../img/portfolio/lycee/image2.jpg") center/cover; }
.home-hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6,23,38,.5), transparent 45%); }
.min-vh-hero { min-height: 720px; padding: 70px 0 130px; }
.home-label { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; color: var(--abo-gold); font-size: .78rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.home-label span { width: 38px; height: 2px; background: currentColor; }
.home-hero h1 { max-width: 850px; margin: 0 0 26px; color: #fff; font-size: clamp(3rem,6vw,5.6rem); font-weight: 800; line-height: 1.02; letter-spacing: -.055em; }
.home-hero h1 em { color: var(--abo-gold); font-style: normal; }
.home-hero .col-xl-8 > p { max-width: 670px; margin-bottom: 34px; color: rgba(255,255,255,.77); font-size: 1.12rem; line-height: 1.75; }
.home-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 14px 22px; border: 1px solid transparent; border-radius: 8px; font-weight: 800; transition: .25s; }
.home-btn:hover { transform: translateY(-3px); }
.home-btn-primary { background: var(--abo-gold); color: var(--abo-navy-deep); }
.home-btn-primary:hover { background: #ffc83d; color: var(--abo-navy-deep); }
.home-btn-glass { border-color: rgba(255,255,255,.38); background: rgba(255,255,255,.08); color: #fff; backdrop-filter: blur(8px); }
.home-btn-glass:hover { background: #fff; color: var(--abo-navy); }
.hero-proof { position: absolute; z-index: 3; right: 12px; bottom: 0; left: 12px; display: grid; grid-template-columns: repeat(3,1fr) 1.5fr; min-height: 94px; border-radius: 14px 14px 0 0; background: #fff; box-shadow: 0 -12px 45px rgba(0,0,0,.12); }
.hero-proof-item, .hero-proof-location { display: flex; align-items: center; justify-content: center; padding: 20px; border-right: 1px solid var(--abo-border); }
.hero-proof-item strong { margin-right: 11px; color: var(--abo-blue); font: 800 1.8rem "Manrope"; }
.hero-proof-item span { max-width: 90px; color: var(--abo-muted); font-size: .8rem; line-height: 1.3; }
.hero-proof-location { gap: 13px; border: 0; background: var(--abo-gold); color: var(--abo-navy); }
.hero-proof-location i { font-size: 1.7rem; }.hero-proof-location small,.hero-proof-location strong { display: block; }.hero-proof-location small { opacity: .7; }
.home-intro,.home-difference,.home-gallery,.home-admission { padding: 110px 0 !important; }
.home-kicker { margin-bottom: 13px; color: var(--abo-blue); font-size: .75rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.home-kicker.light { color: var(--abo-gold); }
.home-title { font-size: clamp(2.1rem,3.6vw,3.35rem); font-weight: 800; line-height: 1.14; letter-spacing: -.045em; }
.home-copy { margin: 24px 0; color: var(--abo-muted); font-size: 1.05rem; line-height: 1.8; }
.intro-collage { position: relative; padding: 0 95px 80px 0; }
.intro-main { width: 100%; height: 510px; border-radius: 18px; object-fit: cover; }
.intro-small { position: absolute; right: 0; bottom: 0; width: 230px; height: 245px; padding: 8px; border-radius: 16px; background: #fff; object-fit: cover; box-shadow: var(--abo-shadow); }
.intro-note { position: absolute; top: 34px; right: 13px; width: 200px; display: flex; gap: 12px; padding: 18px; border-radius: 12px; background: var(--abo-gold); color: var(--abo-navy); box-shadow: var(--abo-shadow); }
.intro-note i { font-size: 1.5rem; }.intro-note strong,.intro-note span { display: block; }.intro-note span { font-size: .8rem; }
.intro-points { margin: 28px 0 30px; }.intro-points > div { display: flex; gap: 14px; margin-bottom: 18px; }.intro-points i { width: 30px; height: 30px; display: grid; flex: 0 0 30px; place-items: center; border-radius: 50%; background: var(--abo-blue-soft); color: var(--abo-blue); font-weight: 800; }.intro-points strong,.intro-points span { display: block; }.intro-points span { color: var(--abo-muted); font-size: .9rem; }.intro-points strong { color: var(--abo-navy); font-size: 1rem; }
.text-link { color: var(--abo-blue); font-weight: 800; }.text-link:hover { color: var(--abo-navy); }
.home-cycles { padding: 110px 0 !important; background: var(--abo-navy-deep); }
.cycle-feature { position: relative; height: 470px; display: block; overflow: hidden; border-radius: 16px; background: #000; }
.cycle-feature img { width: 100%; height: 100%; object-fit: cover; opacity: .78; transition: .5s; }
.cycle-feature:hover img { transform: scale(1.06); opacity: .9; }
.cycle-feature-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 30px; color: #fff; background: linear-gradient(0deg, rgba(5,22,36,.96), transparent 65%); }
.cycle-feature-overlay span { color: var(--abo-gold); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cycle-feature-overlay h3 { margin: 10px 0; color: #fff; font-size: 1.55rem; font-weight: 800; }.cycle-feature-overlay p { margin: 0; color: rgba(255,255,255,.72); }.cycle-feature-overlay > i { position: absolute; right: 25px; top: 25px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.16); color: #fff; }
.home-difference { background: var(--abo-cream); }
.difference-card { position: relative; height: 100%; padding: 30px; overflow: hidden; border: 1px solid var(--abo-border); border-radius: 14px; background: #fff; transition: .3s; }.difference-card:hover { transform: translateY(-7px); box-shadow: var(--abo-shadow); }.difference-card > span { position: absolute; right: 18px; top: 12px; color: #edf1f5; font: 800 3.5rem "Manrope"; }.difference-card > i { position: relative; width: 52px; height: 52px; display: grid; margin-bottom: 22px; place-items: center; border-radius: 11px; background: var(--abo-navy); color: var(--abo-gold); font-size: 1.4rem; }.difference-card h3 { font-size: 1.08rem; font-weight: 800; }.difference-card p { margin: 0; color: var(--abo-muted); line-height: 1.65; }
.gallery-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; grid-template-rows: 250px 250px; gap: 14px; }.gallery-grid img { width: 100%; height: 100%; border-radius: 14px; object-fit: cover; }.gallery-tall { grid-row: span 2; }.gallery-wide { grid-column: span 2; }
.home-admission { padding-top: 40px !important; }.admission-box { padding: 65px; overflow: hidden; border-radius: 20px; color: #fff; background: linear-gradient(115deg, var(--abo-blue), var(--abo-navy)); }.admission-box h2 { max-width: 700px; color: #fff; font-size: clamp(2rem,3.5vw,3.2rem); font-weight: 800; }.admission-box p { color: rgba(255,255,255,.72); }.admission-contact { display: block; margin-top: 14px; color: rgba(255,255,255,.75); font-weight: 700; }.admission-contact:hover { color: #fff; }.footer-portal { color: var(--abo-gold) !important; font-weight: 800; }
@media(max-width:991px){.hero-proof{grid-template-columns:repeat(3,1fr)}.hero-proof-location{display:none}.intro-collage{margin-bottom:45px}.gallery-grid{grid-template-columns:1fr 1fr}.gallery-tall{grid-row:span 2}.gallery-wide{grid-column:auto}.admission-box{padding:45px}.home-hero h1{font-size:clamp(3rem,9vw,4.8rem)}}
@media(max-width:575px){.home-hero,.min-vh-hero{min-height:680px}.min-vh-hero{padding:60px 0 145px}.hero-proof{grid-template-columns:repeat(3,1fr)}.hero-proof-item{display:block;padding:14px 7px;text-align:center}.hero-proof-item strong{display:block;margin:0;font-size:1.35rem}.hero-proof-item span{font-size:.67rem}.home-intro,.home-difference,.home-gallery,.home-admission,.home-cycles{padding:75px 0!important}.intro-collage{padding:0 30px 55px 0}.intro-main{height:400px}.intro-small{width:155px;height:170px}.intro-note{display:none}.cycle-feature{height:400px}.gallery-grid{grid-template-columns:1fr;grid-template-rows:repeat(4,230px)}.gallery-tall,.gallery-wide{grid-row:auto;grid-column:auto}.admission-box{padding:35px 24px}.brand-logo{width:38px;height:38px}}