:root,body{
--bp-text:var(--theme-color-text,#1f2933);
--bp-muted:var(--theme-color-muted,#6b7785);
--bp-primary:var(--theme-color-primary,#2563eb);
--bp-bg:var(--theme-color-background,#ffffff);
--bp-surface:var(--theme-color-surface,#f6f8fa);
--bp-border:var(--theme-color-border,#e3e8ee);
--bp-radius:var(--theme-space-radius,10px);
--bp-gap:var(--theme-space-gap,20px);
--bp-section:var(--theme-space-section,56px);
--bp-width:var(--theme-max-width,1080px);
--bp-body-font:var(--theme-font-body,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif);
--bp-heading-font:var(--theme-font-heading,var(--bp-body-font));
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bp-bg);color:var(--bp-text);font-family:var(--bp-body-font);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--bp-primary)}

.bp-heading{font-family:var(--bp-heading-font);line-height:1.25;margin:0 0 .5em;font-weight:700}
.bp-text{margin:0 0 1em}
.bp-divider{border:0;border-top:1px solid var(--bp-border);margin:var(--bp-gap) 0}
.bp-spacer{width:100%}
.bp-html{white-space:pre-wrap}

.bp-image{margin:0 0 var(--bp-gap)}
.bp-image img{display:block;border-radius:var(--bp-radius)}
.bp-image figcaption{margin-top:8px;color:var(--bp-muted);font-size:14px}

.bp-button{display:inline-block;padding:11px 20px;border-radius:var(--bp-radius);font-weight:600;text-decoration:none;line-height:1.2;border:1px solid transparent}
.bp-button--primary{background:var(--bp-primary);color:#fff}
.bp-button--secondary{background:var(--bp-surface);color:var(--bp-text);border-color:var(--bp-border)}
.bp-button--ghost{background:transparent;color:var(--bp-primary);border-color:currentColor}

.bp-section{padding:var(--bp-section) 20px}
.bp-section__inner{max-width:var(--bp-width);margin:0 auto}
.bp-container{max-width:var(--bp-width);margin:0 auto;padding:0 20px}
.bp-columns{display:flex;flex-wrap:wrap;align-items:flex-start}
.bp-columns--none{gap:0}
.bp-columns--small{gap:12px}
.bp-columns--medium{gap:var(--bp-gap)}
.bp-columns--large{gap:40px}
.bp-column{flex:1 1 0;min-width:0}
.bp-grid{display:grid;gap:var(--bp-gap)}
.bp-grid--1{grid-template-columns:1fr}
.bp-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.bp-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.bp-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.bp-grid--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.bp-grid--6{grid-template-columns:repeat(6,minmax(0,1fr))}

.bp-hero{position:relative;padding:72px 24px;text-align:center;background:var(--bp-surface);border-radius:var(--bp-radius);overflow:hidden}
.bp-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28}
.bp-hero__body{position:relative;max-width:720px;margin:0 auto}
.bp-hero__title{font-family:var(--bp-heading-font);font-size:clamp(30px,4vw,46px);line-height:1.15;margin:0 0 12px}
.bp-hero__subtitle{color:var(--bp-muted);font-size:19px;margin:0 0 22px}
.bp-hero__cta{display:inline-block;padding:12px 24px;border-radius:var(--bp-radius);background:var(--bp-primary);color:#fff;text-decoration:none;font-weight:600}

.bp-card{background:var(--bp-bg);border:1px solid var(--bp-border);border-radius:var(--bp-radius);overflow:hidden;display:flex;flex-direction:column}
.bp-card__image{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.bp-card__body{padding:18px}
.bp-card__title{font-family:var(--bp-heading-font);font-size:19px;margin:0 0 8px}
.bp-card__text{color:var(--bp-muted);margin:0 0 12px}
.bp-card__link{font-weight:600;text-decoration:none}

.bp-faq{border-bottom:1px solid var(--bp-border);padding:14px 0}
.bp-faq__question{cursor:pointer;font-weight:600}
.bp-faq__answer{padding-top:10px;color:var(--bp-muted)}

.bp-cta{background:var(--bp-surface);border-radius:var(--bp-radius);padding:32px;text-align:center}
.bp-cta__title{font-family:var(--bp-heading-font);margin:0 0 10px}
.bp-cta__text{color:var(--bp-muted);margin:0 0 18px}
.bp-cta__button{display:inline-block;padding:12px 24px;border-radius:var(--bp-radius);background:var(--bp-primary);color:#fff;text-decoration:none;font-weight:600}

.bp-quote{margin:0 0 var(--bp-gap);padding:4px 0 4px 20px;border-left:3px solid var(--bp-primary);font-size:19px}
.bp-quote p{margin:0 0 8px}
.bp-quote cite{color:var(--bp-muted);font-size:15px;font-style:normal}

.bp-post-title{font-family:var(--bp-heading-font);font-size:clamp(28px,3.4vw,40px);line-height:1.2;margin:0 0 14px}
.bp-post-meta{display:flex;flex-wrap:wrap;gap:14px;color:var(--bp-muted);font-size:15px;margin-bottom:18px}
.bp-post-category{display:inline-block;padding:4px 11px;border-radius:999px;background:var(--bp-surface);color:var(--bp-text);font-size:13px;text-decoration:none}
.bp-post-content{font-size:18px}
.bp-post-content img{border-radius:var(--bp-radius)}
.bp-post-content h2,.bp-post-content h3{font-family:var(--bp-heading-font);line-height:1.3;margin:1.6em 0 .5em}
.bp-post-content p{margin:0 0 1.1em}
.bp-post-content blockquote{margin:0 0 1.1em;padding-left:18px;border-left:3px solid var(--bp-border);color:var(--bp-muted)}
.bp-post-author{margin-top:28px;padding:18px;border:1px solid var(--bp-border);border-radius:var(--bp-radius)}
.bp-post-author__name{font-weight:600}
.bp-post-author__bio{color:var(--bp-muted);margin:6px 0 0}
.bp-featured{margin:0 0 22px}
.bp-featured img{width:100%;border-radius:var(--bp-radius);display:block}

.bp-related{margin-top:40px}
.bp-related__title{font-family:var(--bp-heading-font);font-size:21px;margin:0 0 16px}
.bp-related__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--bp-gap);grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.bp-related__image{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--bp-radius);display:block;margin-bottom:8px}
.bp-related__link{font-weight:600;text-decoration:none;color:var(--bp-text)}

.bp-breadcrumbs{display:flex;flex-wrap:wrap;gap:8px;color:var(--bp-muted);font-size:14px;margin-bottom:16px}
.bp-breadcrumbs a{color:var(--bp-muted);text-decoration:none}
.bp-site-nav{padding:16px 0}
.bp-site-nav__home{font-weight:700;text-decoration:none;color:var(--bp-text)}

/* --- menus ------------------------------------------------------------- */
.bp-menu{font-family:var(--bp-heading-font)}
.bp-menu__list,.bp-menu__submenu{list-style:none;margin:0;padding:0}
.bp-menu__list{display:flex;gap:4px}
.bp-menu__item{position:relative}
.bp-menu__link{display:block;padding:9px 14px;color:var(--bp-text);text-decoration:none;border-radius:var(--bp-radius);font-weight:500;line-height:1.3}
.bp-menu__link:hover,.bp-menu__link:focus{background:var(--bp-surface);color:var(--bp-primary)}
.bp-menu__item.is-active>.bp-menu__link{color:var(--bp-primary);font-weight:700}
.bp-menu--bar{background:var(--bp-surface);border-radius:var(--bp-radius);padding:6px 10px}
.bp-menu--bordered{border-bottom:1px solid var(--bp-border)}
.bp-menu__title{margin:0 0 8px;padding:0 14px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--bp-muted)}
.bp-menu__subitem.is-active>.bp-menu__link{color:var(--bp-primary);font-weight:700}
.bp-menu--vertical.bp-menu--bar{background:var(--bp-surface);border-radius:var(--bp-radius);padding:14px 8px}

.bp-menu--horizontal .bp-menu__list{flex-direction:row;flex-wrap:wrap;align-items:center}
.bp-menu--vertical .bp-menu__list{flex-direction:column;gap:2px}
.bp-menu--vertical .bp-menu__submenu{margin:2px 0 6px 14px;border-left:2px solid var(--bp-border);padding-left:8px}
.bp-menu--align-start .bp-menu__list{justify-content:flex-start}
.bp-menu--align-center .bp-menu__list{justify-content:center}
.bp-menu--align-end .bp-menu__list{justify-content:flex-end}

/*
 * The dropdown opens on hover AND on focus-within, so it is reachable by
 * keyboard with no script at all. visibility+opacity rather than display so
 * the transition runs and so the submenu keeps its layout box for hit-testing
 * on the way down.
 */
.bp-menu--dropdown .bp-menu__item--has-children>.bp-menu__link::after{content:"";display:inline-block;margin-left:7px;border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.bp-menu--dropdown .bp-menu__submenu{position:absolute;top:100%;left:0;z-index:40;min-width:200px;padding:6px;background:var(--bp-bg);border:1px solid var(--bp-border);border-radius:var(--bp-radius);box-shadow:0 12px 28px rgba(16,24,40,.12);visibility:hidden;opacity:0;transition:opacity .14s ease}
.bp-menu--dropdown .bp-menu__item--has-children:hover>.bp-menu__submenu,
.bp-menu--dropdown .bp-menu__item--has-children:focus-within>.bp-menu__submenu{visibility:visible;opacity:1}
.bp-menu--dropdown .bp-menu__link--sub{padding:8px 12px;font-weight:500}

@media (max-width:1024px){
.bp-grid--4,.bp-grid--5,.bp-grid--6{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
.bp-section{padding:36px 16px}
.bp-columns{flex-direction:column}
.bp-column{width:100%;flex:1 1 auto}
.bp-grid--2,.bp-grid--3,.bp-grid--4,.bp-grid--5,.bp-grid--6{grid-template-columns:1fr}
.bp-hero{padding:48px 18px}
/*
 * A hover-only dropdown is unusable on touch, so below the phone breakpoint
 * the submenu stops being a popover and becomes an indented list that is
 * always visible. Nothing is hidden behind an interaction the device cannot
 * perform.
 */
.bp-menu--dropdown .bp-menu__submenu{position:static;visibility:visible;opacity:1;border:0;box-shadow:none;padding:0 0 0 14px;border-left:2px solid var(--bp-border);border-radius:0;min-width:0}
.bp-menu--dropdown .bp-menu__item--has-children>.bp-menu__link::after{display:none}
.bp-menu--horizontal .bp-menu__list{flex-direction:column;align-items:stretch}
}

/* layout 3 — custom CSS */
:root {
  --navy-950: #071a38;
  --navy-900: #0a2550;
  --blue-700: #0f52b5;
  --blue-600: #1769db;
  --blue-500: #2d82f0;
  --blue-100: #edf5ff;
  --text: #20395f;
  --muted: #6b7d99;
  --white: #ffffff;
  --border: #e5edf7;
  --shadow: 0 12px 32px rgba(19, 54, 100, 0.08);
  --radius: 18px;
  --container: 1180px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: #f7faff;
  color: var(--text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

.paris123-container {
  width: min(calc(100% - 40px), var(--container));
  margin-inline: auto;
}

.paris123-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: linear-gradient(135deg, #0b2a60 0%, #0e56bc 55%, #0b3f96 100%);
  box-shadow: 0 8px 26px rgba(6, 28, 66, 0.18);
}

.paris123-header-inner {
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.paris123-brand {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
}
.paris123-header-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}

.paris123-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 18px;
  border-radius: 999px;
  background: #fff;
  color: var(--blue-700);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.paris123-cta:hover,
.paris123-cta:focus-visible {
  background: #eef6ff;
  transform: translateY(-1px);
  box-shadow: 0 9px 22px rgba(0,0,0,.16);
  outline: none;
}

.paris123-brand-logo {
  width: 180px;
  height: auto;
  object-fit: contain;
}

.paris123-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.paris123-nav a {
  color: rgba(255, 255, 255, 0.95);
  font-size: 14px;
  font-weight: 700;
  padding: 11px 13px;
  border-radius: 10px;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.paris123-nav a:hover,
.paris123-nav a:focus-visible {
  background: rgba(255, 255, 255, 0.12);
  transform: translateY(-1px);
  outline: none;
}

.paris123-menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 12px;
  background: rgba(255,255,255,0.08);
  padding: 10px;
  cursor: pointer;
}

.paris123-menu-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  margin: 5px 0;
  background: #fff;
  border-radius: 999px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.paris123-hero {
  position: relative;
  overflow: hidden;
  background: #0a2047;
}

.paris123-hero-link {
  display: block;
  position: relative;
}

.paris123-hero img {
  width: 100%;
  height: clamp(250px, 40vw, 470px);
  object-fit: cover;
  object-position: center;
}

.paris123-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(5, 26, 63, 0.68) 0%, rgba(5, 26, 63, 0.15) 55%, rgba(5, 26, 63, 0.28) 100%);
}

.paris123-hero-content {
  position: absolute;
  left: max(20px, calc((100% - var(--container)) / 2));
  bottom: clamp(28px, 6vw, 70px);
  max-width: 560px;
  color: #fff;
  text-shadow: 0 3px 20px rgba(0,0,0,0.25);
}

.paris123-hero-kicker {
  display: inline-block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: #d7ebff;
}

.paris123-hero-content h2 {
  margin: 0 0 8px;
  font-size: clamp(32px, 5vw, 60px);
  line-height: 1;
  letter-spacing: -0.035em;
}

.paris123-hero-content p {
  margin: 0;
  max-width: 520px;
  font-size: clamp(14px, 1.5vw, 18px);
  color: rgba(255,255,255,0.92);
}

.paris123-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 38px;
  padding-top: 42px;
  padding-bottom: 58px;
}

.paris123-main {
  min-width: 0;
}

.paris123-eyebrow {
  margin: 0 0 11px;
  font-size: 14px;
  font-weight: 800;
  color: var(--blue-600);
}

.paris123-eyebrow a:hover {
  text-decoration: underline;
}

.paris123-main h1 {
  margin: 0;
  max-width: 900px;
  color: #132f59;
  font-size: clamp(32px, 4vw, 52px);
  line-height: 1.14;
  letter-spacing: -0.035em;
}

.paris123-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}

.paris123-meta-dot {
  opacity: 0.5;
}

.paris123-content {
  margin-top: 28px;
  padding: 30px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: var(--shadow);
  overflow-wrap: anywhere;
}

.paris123-content > :first-child {
  margin-top: 0;
}

.paris123-content > :last-child {
  margin-bottom: 0;
}

.paris123-content h2,
.paris123-content h3,
.paris123-content h4 {
  color: #143762;
  line-height: 1.3;
  margin-top: 1.8em;
}

.paris123-content h2 {
  font-size: clamp(25px, 3vw, 34px);
}

.paris123-content h3 {
  font-size: clamp(20px, 2.4vw, 28px);
}

.paris123-content p,
.paris123-content li {
  color: #4a5f7d;
  font-size: 16px;
}

.paris123-content a {
  color: var(--blue-700);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.paris123-content img {
  width: 100%;
  height: auto;
  margin: 24px 0;
  border-radius: 14px;
}

.paris123-content blockquote {
  margin: 24px 0;
  padding: 16px 20px;
  border-left: 4px solid var(--blue-600);
  background: var(--blue-100);
  border-radius: 0 12px 12px 0;
}

.paris123-sidebar {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.paris123-sidebar-card {
  padding: 26px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}

.paris123-sidebar-label {
  display: block;
  margin-bottom: 8px;
  color: var(--blue-600);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.paris123-sidebar-about h2 {
  margin: 0 0 10px;
  font-size: 25px;
  line-height: 1.2;
  color: #143762;
}

.paris123-sidebar-about p {
  margin: 0;
  color: #5c6e88;
  font-size: 14px;
  line-height: 1.8;
}

.paris123-sidebar-brand {
  text-align: center;
  background: linear-gradient(180deg, #f3f8ff 0%, #ffffff 100%);
}

.paris123-sidebar-brand img {
  width: min(210px, 100%);
  height: auto;
  margin: 0 auto 16px;
}

.paris123-sidebar-brand strong,
.paris123-sidebar-brand span {
  display: block;
}

.paris123-sidebar-brand strong {
  color: var(--blue-700);
  font-size: 16px;
}

.paris123-sidebar-brand span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.paris123-footer {
  background: var(--navy-950);
  color: rgba(255,255,255,0.82);
}

.paris123-footer-inner {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.paris123-footer p {
  margin: 0;
  font-size: 13px;
}

.paris123-footer a {
  font-size: 13px;
  font-weight: 700;
  color: #b9d9ff;
}

.paris123-footer a:hover {
  color: #fff;
}

@media (max-width: 900px) {
  .paris123-shell {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .paris123-sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .paris123-nav a {
    padding-inline: 9px;
  }
}

@media (max-width: 760px) {
  .paris123-container {
    width: min(calc(100% - 28px), var(--container));
  }

  .paris123-header-inner {
    min-height: 66px;
  }

  .paris123-brand-logo {
    width: 150px;
  }

  .paris123-menu-toggle {
    display: block;
  }

  .paris123-nav {
    position: absolute;
    top: 66px;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    padding: 10px 14px 14px;
    background: #0b2a60;
    border-top: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 18px 30px rgba(6, 28, 66, 0.18);
  }

  .paris123-nav.is-open {
    display: flex;
  }

  .paris123-nav a {
    width: 100%;
    padding: 12px 14px;
  }

  .paris123-hero img {
    height: 330px;
  }

  .paris123-hero-overlay {
    background: linear-gradient(90deg, rgba(5, 26, 63, 0.74), rgba(5, 26, 63, 0.3));
  }

  .paris123-hero-content {
    left: 14px;
    right: 14px;
    bottom: 24px;
  }

  .paris123-shell {
    padding-top: 28px;
    padding-bottom: 38px;
  }

  .paris123-main h1 {
    font-size: 34px;
  }

  .paris123-content {
    padding: 21px;
    margin-top: 22px;
    border-radius: 15px;
  }

  .paris123-sidebar {
    grid-template-columns: 1fr;
  }

  .paris123-footer-inner {
    min-height: 68px;
    flex-direction: column;
    justify-content: center;
    padding: 13px 0;
  }
}

@media (max-width: 420px) {
  .paris123-hero img {
    height: 270px;
  }

  .paris123-hero-content h2 {
    font-size: 30px;
  }

  .paris123-main h1 {
    font-size: 29px;
  }
}