/* ==========================================================================
   Thème Bossa — styles complémentaires à theme.json
   ========================================================================== */

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; overflow-x: hidden; }
::selection { background: var(--wp--preset--color--lime); color: var(--wp--preset--color--ink); }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
a { text-underline-offset: 3px; }
img { max-width: 100%; height: auto; }

/* Titres : l'italique devient la signature serif de la marque */
h1 em, h2 em, h3 em, .bossa-footer__claim em {
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	font-weight: 400;
	letter-spacing: -0.015em;
}
:where(.bossa-section, .bossa-page, .bossa-page-head, .bossa-404, .bossa-faq, .bossa-cvpromo) :is(h1, h2) em {
	background: linear-gradient(transparent 62%, var(--wp--preset--color--lime) 62%, var(--wp--preset--color--lime) 92%, transparent 92%);
	padding: 0 .06em;
}
.has-ink-background-color :is(h1, h2, h3) em, .bossa-hero h1 em { color: var(--wp--preset--color--lime); background: none !important; }

/* Pastille */
p.is-style-pill {
	display: inline-flex; align-items: center; gap: 6px; width: fit-content;
	padding: 7px 14px; border-radius: 999px; font-size: 14px; font-weight: 600;
	background: rgba(15, 16, 18, .06); border: 1px solid rgba(15, 16, 18, .1);
}
.has-ink-background-color p.is-style-pill { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .16); color: var(--wp--preset--color--lime); }

/* Liste à coches */
ul.is-style-checks { list-style: none; padding-left: 0; display: flex; flex-direction: column; gap: 10px; }
ul.is-style-checks li { position: relative; padding-left: 32px; }
ul.is-style-checks li::before {
	content: ""; position: absolute; left: 0; top: .2em; width: 22px; height: 22px; border-radius: 50%;
	background: var(--wp--preset--color--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9F45B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat;
}

/* Boutons : variante contour */
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; border: 1.5px solid currentColor; color: inherit; padding: calc(.85rem - 1.5px) calc(1.5rem - 1.5px); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(15, 16, 18, .06); }
.has-ink-background-color .wp-block-button:not(.is-style-outline) > .wp-block-button__link { background: var(--wp--preset--color--lime); color: var(--wp--preset--color--ink); }
.wp-block-button__link { transition: transform .2s, box-shadow .2s, background-color .2s; }
.wp-block-button__link:hover { transform: translateY(-1px); }

/* Carte arrondie */
.wp-block-group.is-style-card { padding: 14px 14px 22px; border-radius: 26px; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); }

/* ------------------------------------------------------------------ En-tête */
.bossa-header { position: relative; z-index: 40; padding-top: 16px; padding-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.bossa-header__bar { gap: 24px; }
.bossa-brand { gap: 10px; }
.bossa-brand .wp-block-site-title a, .bossa-footer .wp-block-site-title a { display: inline-flex; align-items: center; gap: 10px; color: inherit; }
.bossa-brand .wp-block-site-title a::before, .bossa-footer .wp-block-site-title a::before {
	content: ""; flex: none; width: 32px; height: 32px; border-radius: 10px;
	background: var(--wp--preset--color--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M8.5 7h15v4.1h-5.4V25h-4.2V11.1H8.5z' fill='%230F1012'/%3E%3C/svg%3E") center / 100% no-repeat;
	transform: rotate(-6deg); transition: transform .3s;
}
.bossa-brand .wp-block-site-title a:hover::before { transform: rotate(6deg) scale(1.05); }
.bossa-brand:has(.wp-block-site-logo img) .wp-block-site-title a::before { display: none; }
.bossa-nav .wp-block-navigation-item__content { padding: 8px 4px; position: relative; opacity: .85; transition: opacity .2s; text-decoration: none; }
.bossa-nav .wp-block-navigation-item__content:hover, .bossa-nav .current-menu-item > .wp-block-navigation-item__content { opacity: 1; }
.bossa-nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: -2px; height: 2px; border-radius: 2px; background: var(--wp--preset--color--lime); transform: scaleX(0); transition: transform .25s; }
.bossa-nav .wp-block-navigation-item__content:hover::after, .bossa-nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.bossa-nav .wp-block-navigation__container { gap: 28px; }
.bossa-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 24px; }
.bossa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 18px; font-size: 1.6rem; font-family: var(--wp--preset--font-family--display); }
.bossa-header .bossa-usermenu summary { border-color: rgba(255, 255, 255, .25); }

/* --------------------------------------------------------------------- Hero */
.bossa-hero { position: relative; overflow: hidden; padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(30px, 4vw, 56px); border-radius: 0 0 clamp(28px, 4vw, 56px) clamp(28px, 4vw, 56px); }
.bossa-hero::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
	background:
		radial-gradient(600px 300px at 85% 10%, rgba(140, 203, 255, .16), transparent 70%),
		radial-gradient(500px 280px at 10% 90%, rgba(217, 244, 91, .10), transparent 70%);
}
.bossa-hero::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .07;
	background-image: linear-gradient(rgba(255, 255, 255, .6) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .6) 1px, transparent 1px);
	background-size: 64px 64px; mask-image: radial-gradient(ellipse at 70% 30%, #000, transparent 70%);
}
.bossa-hero > * { position: relative; z-index: 1; }
.bossa-hero__cols { gap: clamp(24px, 4vw, 64px) !important; margin-bottom: clamp(36px, 5vw, 64px) !important; }
.bossa-hero h1 { margin: 22px 0 22px; max-width: 13ch; }
.bossa-hero__lead { max-width: 54ch; opacity: .78; margin-bottom: 30px !important; }
.bossa-hero .bossa-stats { margin-top: 0; }

/* ----------------------------------------------------------------- Sections */
.bossa-section { padding-top: clamp(56px, 8vw, 110px); padding-bottom: 0; }
.bossa-section--tight { padding-top: clamp(40px, 5vw, 72px); }
.bossa-home > .bossa-section:last-child, .bossa-faq { padding-bottom: clamp(56px, 8vw, 110px); }
.bossa-section__head { gap: 12px 40px; margin-bottom: clamp(24px, 3vw, 40px); }
.bossa-section__head h2 { margin: 0; max-width: 18ch; }
.bossa-section__intro { max-width: 40ch; margin: 0; color: var(--wp--preset--color--muted); font-size: 1.05rem; }
.has-ink-background-color .bossa-section__intro { color: rgba(255, 255, 255, .7); }
.bossa-panel { padding: clamp(24px, 4.5vw, 60px); border-radius: clamp(28px, 4vw, 44px); }
.bossa-how { padding-bottom: clamp(56px, 8vw, 110px); margin-top: clamp(56px, 8vw, 110px); }
.bossa-how h2 { margin-bottom: clamp(28px, 4vw, 56px); }

/* Cartes « Ce qui change tout » */
.bossa-usp { gap: 16px !important; }
.bossa-usp__card { display: flex; flex-direction: column; gap: 10px; padding: 26px 26px 30px; border-radius: 28px; min-height: 260px; transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
.bossa-usp__card:hover { transform: translateY(-4px) rotate(-.4deg); }
.bossa-usp__card h3 { margin: auto 0 0; font-size: clamp(1.4rem, 2vw, 1.7rem); line-height: 1.1; letter-spacing: -.025em; }
.bossa-usp__card p { margin: 0; }
.bossa-usp__card p:last-child { font-size: .98rem; opacity: .8; }
.bossa-usp__num { font-size: 13px !important; font-weight: 700; letter-spacing: .02em; opacity: 1 !important; padding: 6px 12px; border-radius: 999px; background: rgba(255, 255, 255, .6); width: fit-content; }

/* Étapes */
.bossa-how__steps { gap: 20px !important; }
.bossa-how__step { padding: 28px; border-radius: 28px; background: var(--wp--preset--color--paper); }
.bossa-how__num { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 18px; background: var(--wp--preset--color--ink); color: var(--wp--preset--color--lime); font: 700 26px var(--wp--preset--font-family--display); margin-bottom: 26px; }
.bossa-how__step h3 { margin-bottom: 8px; }
.bossa-how__step p:last-child { color: var(--wp--preset--color--muted); margin: 0; }

/* Promo CV */
.bossa-cvpromo { overflow: hidden; }
.bossa-cvpromo h2 { margin: 16px 0; }
.bossa-cvpromo .wp-block-buttons { margin-top: 28px; }

/* Témoignages */
.bossa-quotes { gap: 18px !important; margin-top: 32px; }
.bossa-quote { display: flex; flex-direction: column; justify-content: space-between; gap: 22px; padding: 28px; border-radius: 28px; }
.bossa-quote__text { margin: 0; font: 400 1.45rem/1.3 var(--wp--preset--font-family--serif); }
.bossa-quote__who { margin: 0; font-size: .95rem; }
.bossa-quote__who strong { font-size: 1rem; }

/* Bandeau recruteurs */
.bossa-employers { gap: 24px !important; }
.bossa-employers h2 { margin: 0 0 8px; }
.bossa-employers p { margin: 0; max-width: 46ch; }
.bossa-employers .wp-block-button:not(.is-style-outline) > .wp-block-button__link { background: var(--wp--preset--color--ink); color: #fff; }

/* FAQ */
.bossa-faq h2 { margin-bottom: 36px; }
.wp-block-details { border: 1px solid var(--wp--preset--color--line); margin-top: 12px !important; transition: box-shadow .2s; }
.wp-block-details[open] { box-shadow: 0 10px 30px rgba(15, 16, 18, .06); }
.wp-block-details summary { cursor: pointer; font: 600 1.15rem/1.35 var(--wp--preset--font-family--display); letter-spacing: -.01em; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--wp--preset--color--paper); font: 400 20px/1 var(--wp--preset--font-family--body); transition: transform .25s; }
.wp-block-details[open] summary::after { transform: rotate(45deg); background: var(--wp--preset--color--lime); }
.wp-block-details > p { color: #3d3f45; margin-top: 12px; }

/* --------------------------------------------------------------- Pages app */
.bossa-app-main { padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(56px, 7vw, 96px); }
.bossa-page { padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(56px, 7vw, 96px); }
.bossa-page__title { margin-bottom: 32px; }
.bossa-page-head { text-align: center; padding: clamp(20px, 4vw, 48px) 0 clamp(28px, 4vw, 48px); }
.bossa-page-head h1 { margin: 0 auto 18px; max-width: 16ch; }
.bossa-page-head p { max-width: 56ch; margin: 0 auto; color: var(--wp--preset--color--muted); font-size: 1.15rem; }
.bossa-page-head .wp-block-buttons { justify-content: center; margin-top: 28px; }
.bossa-faq.wp-block-group:not(.bossa-section) { margin-top: 72px; }

/* Connexion en deux colonnes */
.bossa-auth-split { gap: 0 !important; border-radius: 40px; overflow: hidden; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); }
.bossa-auth-split > .wp-block-column { padding: clamp(24px, 4vw, 56px); display: flex; flex-direction: column; justify-content: center; }
.bossa-auth-split__pitch { background: var(--wp--preset--color--ink); color: #fff; position: relative; overflow: hidden; }
.bossa-auth-split__pitch::after { content: ""; position: absolute; right: -80px; bottom: -80px; width: 260px; height: 260px; border-radius: 50%; background: var(--wp--preset--color--lime); opacity: .9; }
.bossa-auth-split__pitch > * { position: relative; z-index: 1; }
.bossa-auth-split__pitch h1 { font-size: clamp(2.4rem, 4.5vw, 4rem); margin-bottom: 18px; }
.bossa-auth-split__pitch h1 em { color: var(--wp--preset--color--lime); }
.bossa-auth-split__pitch p { opacity: .75; font-size: 1.1rem; }
.bossa-auth-split__pitch ul { list-style: none; padding: 0; margin-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.bossa-auth-split__pitch li { padding-left: 30px; position: relative; }
.bossa-auth-split__pitch li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--wp--preset--color--lime); color: var(--wp--preset--color--ink); display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.bossa-auth-split .bossa-auth { box-shadow: none; border: 0; padding: 0; }

/* Recruteurs */
.bossa-benefit { padding: 28px; border-radius: 28px; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); }
.bossa-benefit h3 { margin-top: 0; }
.bossa-benefit p { color: var(--wp--preset--color--muted); margin-bottom: 0; }
.bossa-rules { margin-top: 64px; padding: clamp(24px, 4vw, 48px); border-radius: 36px; background: var(--wp--preset--color--ink); color: #fff; }
.bossa-rules h2 { margin-top: 0; }
.bossa-rules ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.bossa-rules li { padding-left: 34px; position: relative; font-size: 1.05rem; }
.bossa-rules li::before { content: "✓"; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: var(--wp--preset--color--lime); color: var(--wp--preset--color--ink); display: grid; place-items: center; font-size: 12px; font-weight: 800; }

/* 404 */
.bossa-404 { padding-top: clamp(60px, 10vw, 140px); padding-bottom: clamp(60px, 10vw, 140px); text-align: center; }
.bossa-404__code { font: 800 clamp(96px, 18vw, 220px)/.8 var(--wp--preset--font-family--display); letter-spacing: -.06em; margin: 0 0 24px; -webkit-text-stroke: 2px var(--wp--preset--color--ink); color: var(--wp--preset--color--lime); }
.bossa-404 .wp-block-buttons { justify-content: center; }

/* Blog */
.bossa-posts { gap: 22px !important; }
.bossa-posts .wp-block-post-title { margin: 6px 0; }
.bossa-posts .wp-block-post-title a { text-decoration: none; }

/* ---------------------------------------------------------------- Pied de page */
.bossa-footer { padding-top: clamp(56px, 7vw, 96px); padding-bottom: 32px; margin-top: 0; border-radius: clamp(28px, 4vw, 56px) clamp(28px, 4vw, 56px) 0 0; }
.bossa-footer__top { gap: 40px !important; }
.bossa-footer__claim { font: 700 clamp(2.2rem, 4vw, 3.4rem)/1 var(--wp--preset--font-family--display); letter-spacing: -.04em; margin: 22px 0 14px; }
.bossa-footer__claim em { color: var(--wp--preset--color--lime); }
.bossa-footer__text { opacity: .65; max-width: 40ch; }
.bossa-footer__h { font-family: var(--wp--preset--font-family--body) !important; font-size: 14px !important; letter-spacing: .08em !important; text-transform: uppercase; opacity: .55; font-weight: 600 !important; }
.bossa-footer__links { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.bossa-footer__links a { text-decoration: none; opacity: .9; }
.bossa-footer__links a:hover { color: var(--wp--preset--color--lime); }
.bossa-footer__bottom { margin-top: 56px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 14px; opacity: .6; }
.bossa-footer__bottom p { margin: 0; }

/* -------------------------------------------------------------- Responsive */
@media (max-width: 781px) {
	.bossa-hero h1 { max-width: none; }
	.bossa-section__head { flex-direction: column; align-items: flex-start !important; }
	.bossa-auth-split { border-radius: 28px; }
	.bossa-header__bar { gap: 12px; }
	.bossa-header .bossa-usermenu__link { display: none; }
	.bossa-header .bossa-usermenu__name { display: none; }
	.bossa-employers .wp-block-buttons { width: 100%; }
}
@media (max-width: 600px) {
	.bossa-header .bossa-usermenu .bossa-btn { padding: 7px 12px; font-size: 13px; }
}
