/* Logement Étudiant International France — identité commune. */
:root {
  --container: 1200px;
  --container-pad: 24px;
  --header-h: 82px;
  --shadow-card: 0 1px 0 rgba(24, 54, 83, .08);
  --shadow-soft: 0 18px 50px rgba(24, 54, 83, .12);
  --shadow-btn: 0 6px 18px rgba(24, 54, 83, .12);
  --radius: 12px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 28px;
}

body { font-weight: 400; }
p { font-weight: 400; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); }
.h-trueno { letter-spacing: -.035em; }
:focus-visible { outline: 3px solid var(--peach); outline-offset: 3px; }
.shape { display: none; }

.brand-lockup { display: inline-flex; align-items: center; gap: 10px; color: var(--primary); flex: none; text-decoration: none; }
.brand-lockup .brand-lockup__mark { display: block; width: 44px; height: 44px; object-fit: contain; flex: none; }
.brand-lockup__name { display: flex; flex-direction: column; gap: 5px; font-family: var(--font-heading); font-size: 20px; font-weight: 800; letter-spacing: -.045em; line-height: 1.1; white-space: nowrap; }
.brand-lockup__secondary { font-size: 12px; font-weight: 600; letter-spacing: .035em; }
.footer .brand-lockup { color: #fff; }
.footer .brand-lockup .brand-lockup__mark { background: #fff; border-radius: 11px; padding: 2px; }

.header { padding: 0; border-bottom: 1px solid var(--grey-100); box-shadow: none; }
.header__inner { max-width: 1200px; }
.header__logo { display: inline-flex; align-items: center; }
.nav__link { font-weight: 600; }
.header__login { font-size: 16px; text-decoration: none; }
.header__register { font-size: 15px; }
.header__register[hidden], .mobile-menu__auth a[hidden] { display: none; }
.burger { color: #fff; }
.burger img { filter: brightness(0) invert(1); }
.burger span { color: #fff; font-size: 22px; line-height: 1; }

.btn { min-height: 46px; padding: 11px 22px; font-family: var(--font-heading); font-size: 15px; font-weight: 700; box-shadow: none; }
.btn:hover { transform: translateY(-1px); }
.btn--primary, .btn--solid { background: var(--primary); color: #fff; }
.btn--primary:hover, .btn--solid:hover { background: var(--primary-hover); }
.btn--sunset, .btn--gold { background: var(--peach); color: var(--primary-dark); }
.btn--sunset:hover, .btn--gold:hover { background: #F68B79; filter: none; }
.btn--outline { border-color: var(--primary); }

/* Landing page */
.hero { padding: 64px 0 76px; background: var(--grey-50); }
.hero__grid { grid-template-columns: minmax(0, 1.07fr) minmax(0, .93fr); gap: 52px; align-items: center; }
.hero__copy { padding: 20px 0; }
.hero__title { max-width: 710px; margin-bottom: 24px; font-size: clamp(46px, 5.2vw, 70px); line-height: 1.1; letter-spacing: -.065em; color: var(--primary-dark); }
.hero__title span { display: inline; color: var(--primary); }
.hero__text { max-width: 540px; margin-bottom: 28px; font-size: 19px; line-height: 1.55; text-align: left; color: var(--grey-700); }
.hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 24px; }
.hero__cta { margin: 0; background: var(--peach); color: var(--primary-dark); }
.hero__cta:hover { background: #F68B79; }
.hero__secondary { font-family: var(--font-heading); font-weight: 700; text-decoration: underline; text-decoration-color: var(--peach); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.hero__note { margin-top: 36px; color: var(--grey-700); font-size: 14px; }
.hero__visual { display: block; margin: 0; }
.hero__visual::before { content: ""; position: absolute; inset: 22px -18px -18px 22px; border: 2px solid var(--peach); border-radius: 28px 28px 110px 28px; }
.hero__visual img { position: relative; width: 100%; height: 530px; object-fit: cover; object-position: center 43%; border-radius: 28px 28px 110px 28px; }

.services { margin-top: 110px; }
.services__title { max-width: 720px; margin: 0 auto; font-size: clamp(30px, 3.2vw, 42px); line-height: 1.15; letter-spacing: -.045em; color: var(--primary-dark); }
.services__sub { margin-top: 14px; font-family: var(--font-body); font-size: 18px; font-weight: 400; line-height: 1.4; text-transform: none; color: var(--grey-700); }
.services__icon { border-radius: 24px; background: linear-gradient(145deg, #fff, #eaf1f6); border: 1px solid #dce6ee; padding: 6px; box-shadow: 0 6px 18px rgba(24,54,83,.07), inset 0 1px 0 #fff; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.services__icon img { width: 84px; height: 84px; object-fit: contain; }
.services__tab { opacity: 1; }
.services__tab:hover .services__icon { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(24,54,83,.12); }
.services__tab:focus-visible { outline: 2px solid var(--primary); outline-offset: 6px; border-radius: 24px; }
.services__tabs { display: grid; grid-template-columns: repeat(4, 96px); justify-content: center; gap: 28px; }
.services__tab.is-active .services__icon { background: linear-gradient(145deg, #f4f8fb, #dcecf5); border-color: #183653; box-shadow: 0 8px 24px rgba(24,54,83,.12), inset 0 1px 0 #fff; }
.services__tab.is-active .services__icon img { filter: none; }
.services__label { font-family: var(--font-heading); }
.service-card { border: 1px solid var(--grey-200); border-radius: 22px; box-shadow: none; }
.service-card__btn { background: var(--primary); }
.booking__photo { background-image: url("../images/brand/student-home.webp"); background-position: center 40%; }
.booking__card, .accent-card, .review, .faq__box { box-shadow: var(--shadow-soft); }
.schools { display: none; }
.footer { background: var(--primary-dark); }
.footer__title { font-size: 27px; }

/* Search, detail and account screens */
.villes { background: var(--grey-50); }
.sidebar, .topbar, .searchbar { background: #fff; }
.sidebar { border-right: 1px solid var(--grey-200); }
.sidebar__logo { width: 72px; height: 72px; }
.sidebar__logo img { width: 72px; height: 72px; max-width: 100%; }
.topbar__logo { width: 40px; height: 40px; }
.topbar__logo img { width: 40px; height: 40px; max-width: 100%; }
.listing, .map-card, .filter, .search, .fmodal__box { border-radius: var(--radius-md); }
.listing { border: 1px solid var(--grey-200); }
.mapbox { border-radius: var(--radius-lg); }
.auth__photo { background-image: url("../images/brand/arrival-hero.webp"); background-position: center 44%; }
.auth__logo .brand-lockup__name { font-size: 22px; }
.simple__photo { background-image: url("../images/brand/guidance.webp"); background-position: center 40%; }
.help__img { border-radius: 22px; object-fit: cover; }
.help__box { background: var(--grey-100); }
.editorial-note { margin-top: 28px; color: var(--grey-700); font-size: 14px; line-height: 1.5; }

@media (max-width: 991px) {
  :root { --header-h: 72px; }
  .hero { padding: 42px 0 56px; }
  .hero__grid { grid-template-columns: 1fr; gap: 38px; }
  .hero__copy { padding: 0; }
  .hero__visual { display: block; max-width: 680px; }
  .hero__visual img { height: 390px; }
  .hero__title { font-size: clamp(40px, 7vw, 58px); }
  .burger { width: 48px; height: 48px; }
}

@media (max-width: 600px) {
  :root { --container-pad: 20px; }
  .hero__title { font-size: 40px; }
  .hero__text { font-size: 17px; }
  .hero__visual::before { inset: 12px -10px -10px 12px; }
  .hero__visual img { height: 315px; border-bottom-right-radius: 70px; }
  .hero__secondary { font-size: 14px; }
  .services { margin-top: 72px; }
  .services__tabs { grid-template-columns: repeat(2, 96px); gap: 20px 32px; margin-top: 30px; }
  .brand-lockup .brand-lockup__mark { width: 38px; height: 38px; }
  .brand-lockup__name, .auth__logo .brand-lockup__name { font-size: 17px; }
  .brand-lockup__secondary { font-size: 10.5px; letter-spacing: .015em; }
  .legal-header__inner { gap: 12px; flex-wrap: wrap; padding-block: 12px; }
  .account-header__inner { gap: 12px; flex-wrap: wrap; padding-block: 12px; }
}