/* Lot téléphone 1 (18/10) : en-tête qui se cache, barre « Demander une démo » en bas, comparatif à glisser,
   séjour aux boutons de 44 px, capture d'ordinateur des propriétaires masquée, intégrations repliées.
   Pour retirer : supprimer ce fichier, mobile-lot1.js et leurs deux lignes dans index.html.
   Les gestes sont armés par le script (classe lot1 sur html) : sans JS, la page reste lisible telle quelle. */
.lot1-bar,.lot1-dots,.lot1-more-toggle{display:none}
.lot1-more{display:contents}
@media(max-width:759px){
 /* 1. L'en-tête remonte à la descente ; le menu des chapitres le suit par translate (hero.js garde --header-h) */
 .lot1 .site-header{transition:transform .3s cubic-bezier(.2,.75,.2,1)}
 .lot1.lot1-header-hidden .site-header{transform:translateY(-100%)}
 .lot1 .chapter-nav{transition:transform .35s cubic-bezier(.2,.75,.2,1),opacity .35s,translate .3s cubic-bezier(.2,.75,.2,1)}
 .lot1.lot1-header-hidden .chapter-nav{translate:0 calc(-1 * var(--header-h,76px))}
 .lot1-bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:38;padding:8px 16px calc(8px + env(safe-area-inset-bottom));background:var(--cream);border-top:1px solid var(--line);transform:translateY(110%);visibility:hidden;transition:transform .3s cubic-bezier(.2,.75,.2,1),visibility 0s .3s}
 .lot1-bar.is-on{transform:none;visibility:visible;transition-delay:0s}
 .lot1-bar .button{display:flex;width:100%;min-height:48px;justify-content:center}

 /* 3. Comparatif : les six cartes côte à côte, à glisser ; « Sans » et « Avec » restent ensemble sur chaque carte */
 .lot1 .compare-table tbody{display:flex;gap:12px;margin-inline:-20px;padding:4px 20px 22px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:20px;scrollbar-width:none}
 .lot1 .compare-table tbody::-webkit-scrollbar{display:none}
 .lot1 .compare-table tbody tr,.lot1 .compare-table tbody tr:last-child{display:flex;flex-direction:column;flex:0 0 85%;min-width:0;scroll-snap-align:start;padding:16px;border:1px solid var(--line);border-radius:16px}
 .lot1 .compare-table tbody tr .compare-with{margin-top:auto}
 .lot1-dots{display:flex;justify-content:center;flex-wrap:wrap;margin:2px 0 0}
 .lot1-dots button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer}
 .lot1-dots button:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line);transition:background-color .3s,width .3s}
 .lot1-dots button[aria-current="true"]:before{width:22px;border-radius:99px;background:var(--forest)}
 .lot1-dots button:focus-visible{outline:2px solid var(--terra);outline-offset:-4px;border-radius:8px}

 /* 4. Pendant le séjour : boutons au doigt (resserre.css les ramenait à 41 px) */
 #pendant-sejour .conversation-selector button{min-height:44px}

 /* 6. Propriétaires : la capture d'ordinateur, illisible à cette largeur, laisse la place au téléphone */
 .owners-section .owner-desktop-proof{display:none}
 .docs-dots button{height:44px}

 /* 7. Intégrations : nom et rôle visibles, le détail s'ouvre au toucher */
 .lot1 .lot1-more{display:block;grid-column:2}
 .lot1 .lot1-more[data-closed]{display:none}
 .lot1 .lot1-more-toggle{display:inline-flex;grid-column:2;justify-self:start;align-items:center;gap:8px;min-height:44px;padding:0;border:0;background:transparent;font:inherit;font-size:13px;color:var(--forest);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
 .lot1 .lot1-more-toggle:after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .3s}
 .lot1 .lot1-more-toggle[aria-expanded="true"]:after{transform:translateY(2px) rotate(-135deg)}
 .lot1 .lot1-more-toggle:focus-visible{outline:2px solid var(--terra);outline-offset:4px;border-radius:4px}
}
@media(max-width:759px) and (prefers-reduced-motion:reduce){
 .lot1 .site-header,.lot1 .chapter-nav,.lot1-bar,.lot1-dots button:before,.lot1 .lot1-more-toggle:after{transition:none}
}
@media(max-width:759px){
 .no-motion.lot1 .site-header,.no-motion.lot1 .chapter-nav,.no-motion .lot1-bar,.no-motion .lot1-dots button:before{transition:none}
}
@media(max-width:759px){
 /* Introduction : la phrase « Il couvre quatre besoins » reste collée à sa liste, sous les boutons */
 .hero-copy .hero-bottom>.hero-points-intro{order:3;margin:var(--hero-gap,22px) 0 10px}
 .hero .hero-copy .hero-points-intro+.hero-points{margin-top:0}
}

/* Intégrations en cartes (18/10) : chaque outil dans une carte claire, logo dans une tuile blanche, nom lisible.
   Le nom « Stripe » n'est visible qu'au téléphone (sur ordinateur, le mot-logo fait office de nom). */
.integration-brand .stripe-name{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:759px){
 .integrations-list li{grid-template-columns:52px minmax(0,1fr);column-gap:14px;margin-top:12px;padding:16px;border:1px solid #2f382d1a;border-radius:18px;background:#fffaf2;box-shadow:0 10px 24px #2f382d0d}
 .integrations-list .integration-brand img{box-sizing:border-box;grid-row:1 / span 5;width:52px;height:52px;padding:9px;border-radius:14px;background:#fff;box-shadow:0 4px 12px #2f382d17;object-fit:contain}
 .integrations-list .integration-brand h3{align-self:center;margin:0;font:600 17px/1.4 var(--sans)}
 .integration-brand .stripe-name{position:static;width:auto;height:auto;margin:0;overflow:visible;clip-path:none;white-space:normal}
}
