/* Potocopo : surcharge du thème Margot
 * Charge Margot tel quel, puis ajuste typographie, couleurs et la page d'accueil.
 * Squelettes : lecture.tpl.html (défaut, colonne de lecture), landing.tpl.html (accueil),
 * 1col.tpl.html de Margot (pleine largeur, pour agenda, cartes, tableaux Bazar).
 */
@import url('../../../../themes/margot/styles/margot.css');

@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('../fonts/bricolage-grotesque-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('../fonts/bricolage-grotesque-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Source Serif 4'; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url('../fonts/source-serif-4-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Source Serif 4'; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url('../fonts/source-serif-4-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Source Serif 4'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('../fonts/source-serif-4-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Source Serif 4'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('../fonts/source-serif-4-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --pc-chaux: #F7F5F0;
  --pc-papier: #FDFCFA;
  --pc-trait: rgb(39 52 59 / 14%);

  --main-bg-color: var(--pc-chaux);
  --main-container-bg-color: var(--pc-chaux);
  --main-text-color: var(--neutral-color);

  --title-h1-color: var(--primary-color);
  --title-h2-color: var(--primary-color);
  --title-h3-color: var(--neutral-color);
  --title-h4-color: var(--neutral-color);
  --title-h5-color: var(--neutral-soft-color);

  --link-color: var(--secondary-color-1);
  --link-hover-color: var(--primary-color);

  --navbar-bg-color: var(--pc-chaux);
  --navbar-text-color: var(--primary-color);
  --navbar-link-color: var(--primary-color);
  --navbar-link-hover-color: var(--secondary-color-1);
  --navbar-border: none;

  --header-bg-color: var(--pc-chaux);
  --footer-bg-color: var(--neutral-light-color);
  --footer-text-color: var(--neutral-color);
  --footer-title-color: var(--primary-color);

  --btn-border-radius: 999px;
  --checkbox-color: var(--secondary-color-1);
}

/* ---------- Typographie ---------- */

body {
  background-color: var(--main-bg-color);
  line-height: 1.7;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin-top: 1.6em;
  margin-bottom: 0.5em;
}
h1 { font-size: 2.6rem; letter-spacing: -0.025em; }
h2 { font-size: 1.85rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.15rem; }
h5 { font-size: 1rem; }
.page h2 { margin-top: 1.8em; }
.page h3 { margin-top: 1.5em; }
.page > h1:first-child, .page > h2:first-child { margin-top: 0.4em; }

a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
a:hover, a:focus { text-decoration-thickness: 2px; }
#yw-topnav a, .btn, .nav a, .dropdown-menu a, .pagination a, .BAZ_menu a { text-decoration: none; }

:focus-visible { outline: 2px solid var(--secondary-color-1); outline-offset: 2px; }

::selection { background: rgb(138 75 38 / 18%); }

/* L'interface parle en grotesque, le contenu en sérif */
#yw-topnav, .btn, label, legend, th, .nav, .dropdown-menu, .pagination, .badge, .label,
.form-control, .input-group-addon, .breadcrumb, .alert strong, .modal-title,
.BAZ_label, .bazar-entry .field-label, .facette-container, #yw-footer strong {
  font-family: var(--main-title-fontfamily);
}
.form-control { font-size: 1rem; }

blockquote {
  border-left: 2px solid var(--secondary-color-1);
  padding: 0.2em 0 0.2em 1.2em;
  font-style: italic;
  color: var(--neutral-soft-color);
}

hr { border-top: 1px solid var(--pc-trait); }

table { background: var(--pc-papier); }
.table > thead > tr > th { border-bottom: 1px solid var(--primary-color); font-weight: 600; }
.table > tbody > tr > td { border-top: 1px solid var(--pc-trait); }

pre, code, tt { color: var(--neutral-color); font-size: 0.88em; background: var(--neutral-light-color); border: none; border-radius: 4px; }

/* ---------- Boutons ---------- */

.sr-only:not(:focus) { padding: 0 !important; border: 0 !important; }
.page .btn { font-weight: 600; padding: 0.55em 1.3em; transition: background-color .15s, color .15s, border-color .15s; }
.btn-primary, .btn-primary:focus {
  background-color: var(--secondary-color-1);
  border-color: var(--secondary-color-1);
  color: #fff;
}
.btn-primary:hover, .btn-primary:active {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}
.btn-default {
  background: transparent;
  border: 1px solid rgb(39 52 59 / 40%);
  color: var(--primary-color);
}
.btn-default:hover, .btn-default:focus {
  background: var(--primary-color);
  border-color: var(--primary-color);
  color: var(--pc-chaux);
}

/* ---------- Barre de navigation ---------- */

#yw-topnav { border-bottom: 1px solid var(--pc-trait); padding: 0.7rem 0; }
#yw-topnav .navbar-brand { font-weight: 800; letter-spacing: -0.03em; color: var(--primary-color); }
#yw-topnav .links-container a { font-weight: 500; }
#yw-topnav .links-container .active > a { color: var(--secondary-color-1); }

/* ---------- Pied de page ---------- */

#yw-footer { border-top: 1px solid var(--pc-trait); padding: 2.5rem 0 2rem; font-size: 0.95rem; line-height: 1.6; }

/* ---------- Squelette « lecture » : une colonne à longueur de ligne confortable ---------- */

.pc-lecture #yw-main .yw-main-content { max-width: 46rem; }
.pc-lecture #yw-main { padding-top: 2.5rem; padding-bottom: 4rem; }

/* ---------- Squelette « landing » ---------- */

.pc-landing #yw-main:has(.pc-hero):not(:has(#ACEditor)) { padding: 0; }
.pc-landing #yw-main:has(.pc-hero):not(:has(#ACEditor)) .yw-main-content { max-width: none; }
.pc-landing section.full-width .container { max-width: 1160px; padding: 0 2rem; }
.pc-landing h1, .pc-landing h2, .pc-landing h3 { margin-top: 0; }

/* Accroche */
.pc-landing section.pc-hero {
  padding: 6rem 0 5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600' fill='none' stroke='%238A4B26' stroke-width='1' stroke-opacity='.38'%3E%3Cellipse cx='298.9' cy='300.7' rx='18.0' ry='17.6'/%3E%3Cellipse cx='298.0' cy='301.4' rx='34.9' ry='33.8'/%3E%3Cellipse cx='296.6' cy='302.2' rx='57.5' ry='57.0'/%3E%3Cellipse cx='294.8' cy='303.5' rx='87.4' ry='88.3' stroke-width='1.8'/%3E%3Cellipse cx='293.6' cy='304.2' rx='103.6' ry='105.0'/%3E%3Cellipse cx='292.4' cy='305.1' rx='123.3' ry='124.5'/%3E%3Cellipse cx='290.7' cy='306.2' rx='153.7' ry='154.8'/%3E%3Cellipse cx='289.5' cy='307.0' rx='178.4' ry='178.3' stroke-width='1.8'/%3E%3Cellipse cx='288.0' cy='308.0' rx='205.9' ry='202.2'/%3E%3Cellipse cx='286.3' cy='309.1' rx='230.8' ry='225.0'/%3E%3Cellipse cx='285.4' cy='309.8' rx='240.0' ry='239.6'/%3E%3Cellipse cx='283.9' cy='310.8' rx='260.9' ry='269.9' stroke-width='1.8'/%3E%3Cpath d='M292 306 L200 40' stroke='%23F7F5F0' stroke-opacity='1' stroke-width='5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right -140px top -60px;
  background-size: 640px 640px;
}
.pc-landing .pc-hero h1 {
  font-size: clamp(2.5rem, 5.4vw, 4.4rem);
  line-height: 1.02;
  letter-spacing: -0.035em;
  max-width: 15ch;
  text-wrap: balance;
  margin-bottom: 1.4rem;
}
.pc-landing .pc-hero .col-md-7 { font-size: 1.2rem; line-height: 1.6; color: var(--neutral-soft-color); }
.pc-landing .pc-hero .btn { margin: 2rem 0.6rem 0 0; font-size: 1rem; }

.pc-landing .pc-infos {
  margin-top: 4.5rem;
  background: var(--pc-papier);
  border: 1px solid var(--pc-trait);
  border-radius: 14px;
  padding: 1.6rem 1.8rem;
  font-size: 1.05rem;
  line-height: 1.5;
}
.pc-landing .pc-infos b, .pc-landing .pc-infos strong {
  display: block;
  font-family: var(--main-title-fontfamily);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--neutral-soft-color);
  margin-top: 1rem;
}
.pc-landing .pc-infos b:first-child, .pc-landing .pc-infos strong:first-child { margin-top: 0; }
.pc-landing .pc-infos a { display: inline-block; margin-top: 1.2rem; font-family: var(--main-title-fontfamily); font-weight: 600; }

/* Deux portes */
.pc-landing section.pc-portes { padding: 1rem 0 5rem; }
.pc-landing .pc-portes .row { display: flex; flex-wrap: wrap; gap: 2rem; margin: 0; }
.pc-landing .pc-portes .row::before, .pc-landing .pc-portes .row::after { display: none; }
.pc-landing .pc-portes .row > .col-md-6 { flex: 1 1 22rem; width: auto; float: none; }
.pc-landing .pc-porte > * { max-width: 34rem; }
.pc-landing .pc-porte {
  border-top: 2px solid var(--primary-color);
  padding-top: 1.6rem;
}
.pc-landing .pc-porte:not(.pc-porte--sombre) { padding-left: 0; padding-right: 0; }
.pc-landing .pc-porte h2 { font-size: 1.9rem; margin-bottom: 0.8rem; }
.pc-landing .pc-porte .btn { margin-top: 1.4rem; }
.pc-landing .pc-porte--sombre {
  background: var(--primary-color);
  color: #C9C4BA;
  border-top: none;
  border-radius: 14px;
  padding: 2.2rem 2.4rem 2.4rem;
}
.pc-landing .pc-porte--sombre h2 { color: var(--pc-chaux); }
.pc-landing .pc-porte--sombre a:not(.btn) { color: #E3B58F; }
.pc-landing .pc-porte--sombre .btn-default { color: var(--pc-chaux); border-color: rgb(247 245 240 / 45%); }
.pc-landing .pc-porte--sombre .btn-default:hover { background: var(--pc-chaux); color: var(--primary-color); }

/* Trois façons de venir */
.pc-landing section.pc-facons { padding: 4.5rem 0 5rem; background: var(--neutral-light-color); }
.pc-landing .pc-facons h2 { font-size: 2.2rem; max-width: 20ch; margin-bottom: 2.4rem; }
.pc-landing .pc-facons h3 { font-size: 1.3rem; margin-bottom: 0.5rem; }
.pc-landing .pc-facons .col-md-4 { border-left: 1px solid rgb(39 52 59 / 22%); padding-left: 1.4rem; }

/* Agenda et adhésion */
.pc-landing section.pc-agenda { padding: 5rem 0; }
.pc-landing .pc-agenda h2 { font-size: 2rem; }
.pc-landing .pc-adherer {
  background: var(--secondary-color-1);
  color: #fff;
  border-radius: 14px;
  padding: 2rem 2.2rem 2.2rem;
}
.pc-landing .pc-adherer h3 { color: #fff; font-size: 1.6rem; }
.pc-landing .pc-adherer .btn-primary { background: var(--pc-chaux); border-color: var(--pc-chaux); color: var(--primary-color); margin-top: 1.4rem; }
.pc-landing .pc-adherer .btn-primary:hover { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }

/* ---------- Écrans étroits ---------- */

@media (max-width: 991px) {
  .pc-landing section.pc-hero { padding: 3.5rem 0 3rem; background-size: 380px 380px; background-position: right -170px top -40px; }
  .pc-landing .pc-infos { margin-top: 2.5rem; }
  .pc-landing .pc-facons .col-md-4 { margin-bottom: 1.8rem; }
  .pc-landing .pc-adherer { margin-top: 2.5rem; }
}
@media (max-width: 600px) {
  .pc-landing section.full-width .container { padding: 0 1.2rem; }
  .pc-landing .pc-porte--sombre { padding: 1.8rem 1.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- Impression : la doc machine finit au mur ---------- */

@media print {
  #yw-topnav, #yw-footer, .footer, .barre-edition, .BAZ_actions_fiche { display: none !important; }
  body { background: #fff; font-size: 11pt; }
  .pc-lecture #yw-main .yw-main-content { max-width: none; }
  a { color: inherit; }
}