:root{color-scheme:light;--ink:#202b29;--muted:#485650;--cream:#f9f7f2;--paper:#fffefa;--pine:#234d42;--line:#d9dfd9;--warm:#eef0e8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit}a:focus-visible{outline:3px solid #b46a28;outline-offset:5px}.wrap{max-width:1180px;margin:auto;padding:0 clamp(24px,5vw,66px)}.skip{position:absolute;top:-80px;left:20px;background:#fff;padding:10px;z-index:10}.skip:focus{top:12px}.masthead{border-bottom:1px solid var(--line);background:var(--paper)}.nav{display:flex;justify-content:space-between;align-items:center;min-height:94px;gap:22px}.wordmark{text-decoration:none;font-family:Literata,Georgia,serif;font-size:30px;letter-spacing:-.065em;font-weight:600;line-height:1}.period{color:#bd8c60}.wordmark small{display:block;font:500 10px 'DM Sans',sans-serif;letter-spacing:.23em;text-transform:uppercase;margin-top:11px;color:var(--muted)}nav{display:flex;gap:clamp(12px,2.5vw,30px);align-items:center;flex-wrap:wrap}nav a{text-decoration:none;font-size:13px;font-weight:600}nav a:hover,.quiet:hover{color:#a35f33}.nav-contact{border:1px solid var(--pine);padding:9px 17px}.hero{background:var(--cream);padding:clamp(80px,11vw,155px) 0 70px}.eyebrow{font-size:11px!important;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--pine);margin:0 0 24px!important}h1,h2,h3{font-family:Literata,Georgia,serif;line-height:1.19;letter-spacing:-.045em;font-weight:500}h1{max-width:980px;font-size:clamp(40px,5.3vw,76px);margin:0}h1 em{color:var(--pine);font-weight:400}.lead{max-width:680px;font-size:clamp(18px,2vw,22px);line-height:1.65;color:#394843;margin:32px 0}.hero-links{display:flex;flex-wrap:wrap;align-items:center;gap:30px}.button{display:inline-flex;gap:22px;background:var(--pine);color:white;text-decoration:none;padding:15px 22px;font-size:14px;font-weight:600}.button:hover{background:#193a31}.quiet{text-decoration:none;font-size:14px;font-weight:600}.since{border-top:1px solid var(--line);margin:76px 0 0;padding-top:21px;font-size:13px;color:var(--muted)}.section{padding:clamp(75px,9vw,125px) 0}.section h2{font-size:clamp(33px,4vw,54px);max-width:740px;margin:0 0 50px}.services{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 66px}.services article{padding:31px 0 42px;border-top:1px solid var(--line)}.num{font-size:12px;color:var(--pine);font-weight:700}.services h3{font-size:27px;margin:12px 0}.services p,.prose p,.history p,.contact p{font-size:17px;color:#3e4b46;max-width:560px}.status{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid #c4cfca;border-radius:50px;padding:3px 11px}.section-warm{background:var(--warm)}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px}.split h2{margin-bottom:0}.prose p:first-child{margin-top:0}.year{font-family:Literata,serif;font-size:clamp(55px,10vw,135px);letter-spacing:-.07em;color:var(--pine);line-height:1.2}.year span{color:#b7c1b9;padding:0 .08em}.history h2{margin:22px 0}.history>p:last-child{max-width:720px}.contact{background:#e1e8df}.note{font-size:13px!important;color:#50645b!important}footer{background:var(--ink);color:#f6f5ee;padding:36px 0}.foot{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;font-size:12px}.foot div{display:flex;flex-direction:column}.foot strong{font:500 25px Literata,serif;letter-spacing:-.06em}.foot span{color:#cbd5cf}.foot a{text-decoration:none}footer p{margin:0}@media(max-width:720px){.nav{align-items:flex-start;flex-direction:column;padding-top:22px;padding-bottom:20px;min-height:0}nav{gap:16px 22px}.hero{padding-top:82px}.services,.split{grid-template-columns:1fr;gap:18px}.section h2{margin-bottom:32px}.services article{padding-bottom:20px}.year{font-size:clamp(48px,12vw,90px)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.history-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:45px}.history-principles>div{border-top:1px solid var(--line);padding-top:18px}.history-principles span{display:block;color:var(--pine);font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;margin-bottom:12px}.history-principles strong{display:block;font-family:Literata,Georgia,serif;font-size:22px;font-weight:500}.history-principles p{font-size:15px;line-height:1.65}@media(max-width:720px){.history-principles{grid-template-columns:1fr;gap:18px}}

.postal{font-style:normal;line-height:1.85;font-size:18px;color:var(--ink);margin:20px 0}.compact-hero{padding-top:80px;padding-bottom:75px}.compact-hero h1{font-size:clamp(42px,5vw,66px)}

.section-intro{font-size:18px;max-width:690px;color:var(--muted);margin:-20px 0 38px}.use-cases .num{letter-spacing:.05em;text-transform:uppercase}.use-cases h3{margin-top:15px}@media(max-width:720px){.section-intro{margin-top:-8px}}

/* Unpli : service de messagerie ouvert, lien visible et conforme à la charte Abergement. */
.nav-unpli{color:var(--pine);text-decoration:underline;text-decoration-color:#b8c8bf;text-underline-offset:5px}
.service-link{display:inline-flex;align-items:center;gap:15px;color:var(--pine);font-weight:700;font-size:15px;text-decoration:none;border-bottom:1px solid #99afa4;padding-bottom:5px}
.service-link:hover,.nav-unpli:hover{color:#a35f33;border-color:#a35f33}
.status-live{color:var(--pine);background:#eaf1eb;border-color:#8aab97;font-weight:700}

/* ABERGEMENT / typographie commune Savoy : déclinaison technique et sobre. */
:root {
  --ink:#282923; --muted:#64645b; --cream:#f5f2eb;
  --paper:#f8f6f0; --pine:#313832; --line:#cbc9bd; --warm:#efede5;
  --bronze:#a57f46; --reading:"Savoy Source Serif 4",Georgia,serif;
  --title:"Savoy EB Garamond",Georgia,serif;
  --ui:"Savoy Source Sans 3",Arial,sans-serif;
  --interface:"Savoy Cabin",Arial,sans-serif;
}
html{scroll-behavior:smooth}
body{background:var(--paper);font:400 16px/1.72 var(--interface);color:var(--ink)}
.wrap{max-width:1210px;padding-inline:clamp(21px,6vw,76px)}
.masthead{background:var(--paper);border-bottom:1px solid var(--line)}
.nav{min-height:87px}
.wordmark,.foot strong{font-family:var(--title);font-weight:400;letter-spacing:-.025em}
.wordmark{font-size:clamp(30px,3vw,40px)}
.wordmark small{font-family:var(--ui);font-size:10px;letter-spacing:.16em}
.period{color:var(--bronze)}
nav{column-gap:clamp(13px,2vw,26px)}
nav a{font:650 13px/1.4 var(--ui)}
nav .nav-contact{border:1px solid var(--line);padding:10px 16px;background:#f2f0e9}
.nav-unpli{color:var(--ink);text-decoration-color:var(--bronze)}
.nav-unpli:hover{color:#826231}
.hero{background:var(--cream);padding:clamp(68px,9.5vw,116px) 0 clamp(46px,6vw,83px);border-bottom:1px solid var(--line)}
h1,h2,h3{font-family:var(--title);font-weight:400;letter-spacing:-.016em;overflow-wrap:normal}
h1{font-size:clamp(44px,5.4vw,74px);line-height:1.05;max-width:1000px}
h1 em{color:var(--pine);font-weight:400}
h2{line-height:1.14}h3{line-height:1.18}
.eyebrow{font:750 11px/1.5 var(--ui)!important;letter-spacing:.15em;color:#786443;margin-bottom:19px!important}
.lead{font:400 clamp(17px,1.85vw,21px)/1.7 var(--reading);max-width:690px;color:#454841;margin:27px 0}
.button{background:var(--pine);border:1px solid var(--pine);font-family:var(--ui);border-radius:0;min-height:47px;align-items:center}
.button:hover{background:#454c44}
.quiet,.service-link{font-family:var(--ui);font-weight:700}
.since{border-top:1px solid var(--line);margin-top:57px;color:var(--muted);font-family:var(--ui);font-size:12px}
.section{padding:clamp(62px,7.5vw,103px) 0}
.section h2{font-size:clamp(38px,4.2vw,53px);max-width:735px;margin:0 0 37px}
.services{column-gap:clamp(32px,4.8vw,75px)}
.services article{padding:27px 0 36px}
.services h3{font-size:clamp(27px,2.4vw,34px);margin:10px 0 15px}
.services p,.prose p,.history p,.contact p,.section-intro{font:400 clamp(15px,1.36vw,17px)/1.85 var(--reading);color:#3e433c;max-width:66ch}
.services p{margin-bottom:15px}
.prose p{max-width:66ch}
.section-warm{background:var(--warm)}
.split{grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(35px,7vw,90px)}
.num{font:700 12px/1.5 var(--ui);color:#786443}
.history{max-width:900px}
.history>p{max-width:740px}
.history .year{font-family:var(--title);color:#7b715f}
.history-principles strong{font-family:var(--title);font-size:26px;line-height:1.2}
.history-principles p{font-size:15px}
.history-principles span{font-family:var(--ui);color:#81683f}
.note{font-family:var(--ui)!important;font-size:13px!important}
.status-live{display:none}
.service-link{color:var(--pine);border-bottom:1px solid var(--bronze)}
footer{background:#313832;color:#f7f5ee}
.foot{font-family:var(--ui);gap:20px}
.foot strong{font-size:30px}
.foot a:hover{color:#ebd5ad}
.section-intro{max-width:69ch}
.prose a:not(.quiet){text-decoration-thickness:1px;text-underline-offset:.2em}
a:focus-visible{outline:2px solid #927044;outline-offset:4px}
@media(max-width:720px){
 .nav{min-height:0;gap:16px;padding-block:20px}
 nav{row-gap:12px;column-gap:21px}
 .hero{padding-top:62px}
 .services,.split{grid-template-columns:1fr;gap:20px}
 .section h2{margin-bottom:25px}
 .services article{padding:23px 0 26px}
 .since{margin-top:43px}
 .history-principles{grid-template-columns:1fr}
}
@media(max-width:390px){
 .wrap{padding-inline:18px}
 h1{font-size:42px}
 .section h2{font-size:37px}
 .nav-contact{padding:8px 12px!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Navigation mobile-first, sans JavaScript (CSP script-src none). */
.mobile-menu{display:none}
@media(max-width:950px){
  .nav{display:flex;flex-direction:row;align-items:center;justify-content:space-between;min-height:74px;padding-block:12px;gap:20px}
  .nav>nav[aria-label="Navigation principale"]{display:none}
  .wordmark{font-size:31px;flex:none}
  .wordmark small{font-size:9px;margin-top:6px}
  .mobile-menu{display:block;margin-left:auto;position:relative;z-index:100}
  .mobile-menu summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:13px;min-height:44px;padding:9px 13px;border:1px solid var(--line);font:750 13px/1.3 var(--ui);color:var(--ink);cursor:pointer;background:#f8f6f0;white-space:nowrap}
  .mobile-menu summary::-webkit-details-marker{display:none}
  .mobile-menu summary:hover{background:#edeae1}
  .mobile-menu summary:focus-visible{outline:3px solid #a57f46;outline-offset:2px}
  .menu-bars{font:500 21px/1 var(--ui);color:#816d4e}
  .mobile-menu>nav{position:absolute;display:flex;flex-direction:column;align-items:stretch;gap:0;right:0;top:calc(100% + 9px);width:min(274px,calc(100vw - 36px));background:#f9f7f2;border:1px solid var(--line);box-shadow:0 16px 26px rgba(35,37,31,.14);padding:6px 0;z-index:100}
  .mobile-menu nav a{display:flex;min-height:44px;align-items:center;padding:10px 18px;border-bottom:1px solid #e6e0d5;text-decoration:none;font:650 14px/1.45 var(--ui);color:var(--ink)}
  .mobile-menu nav a:last-child{border-bottom:0}
  .mobile-menu nav a:hover,.mobile-menu nav a:focus-visible{background:#eee9dc;color:#5a492f}
  .mobile-menu nav .nav-contact{border:0;background:transparent;padding:10px 18px}
  .hero{padding-top:clamp(37px,8vw,55px);padding-bottom:clamp(28px,5vw,42px)}
  .hero .lead{margin:20px 0 21px}
  .hero-links{gap:16px 26px}
  .since{margin-top:29px;padding-top:14px}
  .section{padding:clamp(42px,7vw,62px) 0}
  .section h2{margin-bottom:23px}
  .services article{padding-block:18px 19px}
  .history-principles{margin-top:25px}
  .compact-hero{padding-top:47px;padding-bottom:38px}
}
@media(max-width:380px){
  .wordmark{font-size:28px}
  .mobile-menu summary{padding-inline:11px}
  .hero h1{font-size:clamp(39px,12vw,42px)}
  .section h2{font-size:clamp(34px,10.7vw,37px)}
}

/* Audit accessibilité : typographie des mentions et parcours clavier. */
.wordmark small{font-size:11px;line-height:1.5}
.eyebrow{font-size:12px!important}
.num{font-size:13px}
.since{font-size:13px;line-height:1.75}
.foot{font-size:13px}
.foot a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:.24em}
.foot .to-top{width:44px;height:44px;justify-content:center;flex:none;border:1px solid #89948d;border-radius:50%;font-size:22px;text-decoration:none}
.foot .to-top:hover{background:#465348}
.postal{font-family:var(--reading);font-style:normal}
.prose a:not(.quiet){text-decoration-thickness:1px;text-underline-offset:3px}
@media(max-width:720px){.foot{row-gap:10px}.foot a{min-height:44px}}

/* Filigrane technique : rack discret en haut de la seule page d'accueil. */
.hero-home{position:relative;isolation:isolate;overflow:hidden}
.hero-home::before{
 content:"";position:absolute;z-index:0;inset:0 0 0 auto;
 width:clamp(340px,48vw,720px);
 background:url("/assets/rack-filigrane-hd.avif") center right/cover no-repeat;
 opacity:.94;pointer-events:none;
 -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.14) 48%,#000 95%);
 mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.14) 48%,#000 95%);
}
.hero-home>.wrap{position:relative;z-index:1}
@media(max-width:720px){
 .hero-home::before{
   width:64%;opacity:.26;
   -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.4) 34%,#000 100%);
   mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.4) 34%,#000 100%);
 }
}

/* Finition : navigation des deux activités à largeur confortable. */
.nav-editions{color:#635540;font-weight:650}
.nav-editions:hover{color:#966832}
@media(min-width:951px){.nav>nav[aria-label="Navigation principale"]{flex-wrap:nowrap;gap:clamp(10px,1.25vw,22px)}}

/* ABERGEMENT_JUSTIFICATION_20261022
   Règle éditoriale du Corpus : justification de la prose suivie,
   jamais des titres, menus, citations, boutons, notes ni liens isolés.
   La langue du document fr-CH active les césures françaises lorsque
   le moteur du navigateur dispose du dictionnaire correspondant. */
@media (min-width:900px) {
  main .section p:not(.eyebrow):not(.num):not(.note):not(.section-intro):not(:has(> a:only-child)) {
    text-align:justify;
    hyphens:auto;
    -webkit-hyphens:auto;
    hyphenate-limit-chars:6 3 3;
    text-wrap:wrap;
  }
}
@media (max-width:899px) {
  main .section p:not(.eyebrow):not(.num):not(.note):not(.section-intro):not(:has(> a:only-child)) {
    text-align:start;
    hyphens:manual;
    -webkit-hyphens:manual;
    text-wrap:pretty;
  }
}

/* ABERGEMENT_FOOTER_UP_RIGHT_20261022
   Replacer la commande de remontée en fin de ligne, même avec retour à la ligne. */
.foot .to-top{margin-inline-start:auto;}

/* ABERGEMENT_SCROLL_TOP_20261022
   Une seule flèche. Affichage après un premier défilement, uniquement
   avec les animations natives liées au scroll (aucun JavaScript).
   Repli sans support : flèche classique dans le pied de page. */
@keyframes abergement-scrolltop-show {
  from { opacity:0; visibility:hidden; transform:translateY(12px); }
  to { opacity:1; visibility:visible; transform:translateY(0); }
}
@supports (animation-timeline: scroll()) {
  .foot .to-top {
    position:fixed;
    inset-inline-end:clamp(16px,3vw,30px);
    inset-block-end:clamp(16px,3vw,30px);
    z-index:90;
    margin:0;
    width:48px;
    height:48px;
    background:#313832;
    color:#fff;
    border-color:#919c94;
    box-shadow:0 4px 16px rgba(23,26,22,.18);
    opacity:0;
    visibility:hidden;
    animation:abergement-scrolltop-show linear both;
    animation-timeline:scroll(root block);
    animation-range:0px 100px;
  }
  .foot .to-top:hover { background:#465348;color:#fff; }
}
@media(prefers-reduced-motion:reduce){
  @supports(animation-timeline:scroll()){
    .foot .to-top{animation-range:0px 1px;}
  }
}

/* Formulaire de contact · typographie et palette Abergement communes. */
.contact-form-section{background:var(--paper)}
.contact-form-section .form-intro{max-width:35ch;font:400 1.05rem/1.8 var(--reading);color:var(--muted)}
.contact-form{display:grid;gap:1.2rem;max-width:620px}
.contact-form .form-field{display:grid;gap:.42rem}
.contact-form .form-field>label{font:600 .89rem/1.5 var(--ui);color:var(--ink)}
.contact-form :is(input:not([type=checkbox]),select,textarea){display:block;width:100%;min-width:0;background:#fffefa;color:var(--ink);border:1px solid #b9bcb2;padding:.9rem .95rem;border-radius:0;font:400 1rem/1.5 var(--ui);box-sizing:border-box}
.contact-form textarea{resize:vertical;min-height:10rem}
.contact-form :is(input,select,textarea):focus-visible{outline:2px solid var(--pine);outline-offset:2px}
.contact-form :is(input,select,textarea):user-invalid{border-color:#96593c}
.contact-form .form-consent{display:flex;align-items:flex-start;gap:.75rem;font:400 .87rem/1.65 var(--ui);color:var(--muted)}
.contact-form .form-consent input{width:18px;height:18px;flex:none;margin:.2rem 0 0;accent-color:var(--pine)}
.contact-form .form-consent a{text-underline-offset:.2em}
.contact-form .form-help{font:400 .77rem/1.65 var(--ui);color:var(--muted);margin:0!important}
.contact-form .form-submit{cursor:pointer;justify-self:start;appearance:none;font-size:.91rem}
.contact-form .form-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
@media(max-width:720px){.contact-form{gap:1.1rem}.contact-form .form-submit{width:100%;justify-content:center}.contact-form-section .form-intro{margin:0 0 1.5rem}}