/* * Charte extraite de docs/dupaindanslesmains-maquette.html * TODO : auto-héberger Marcellus, Fraunces et Hanken Grotesk dans assets/fonts/ */ :root{ --beige:#efe4d2; --beige-2:#e4d4bc; --cream:#f8f1e4; --paper:#fbf7ee; --brown:#52331f; --brown-deep:#311c10; --brown-mid:#74492c; --orange:#cf6f29; --orange-soft:#e09a4f; --terracotta:#a8451f; --ink:#241710; --muted:#917656; --line:#cbb491; --shadow:0 26px 60px -28px rgba(49,28,16,.55); --display:'Marcellus',Georgia,serif; --serif:'Fraunces',Georgia,serif; --sans:'Hanken Grotesk',system-ui,sans-serif; } *{margin:0;padding:0;box-sizing:border-box} html{scroll-behavior:smooth} body{ font-family:var(--sans); color:var(--ink); background:var(--beige); line-height:1.6; -webkit-font-smoothing:antialiased; } body.no-scroll{overflow:hidden} img{max-width:100%;display:block} a{color:inherit;text-decoration:none} h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;letter-spacing:0;font-optical-sizing:auto} .wrap{max-width:1200px;margin:0 auto;padding:0 24px} /* paper grain over whole site */ body::after{ content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"); } /* ---------- Texture background ---------- */ body::before{ content:"";position:fixed;inset:0;z-index:-1;pointer-events:none; background: radial-gradient(1200px 600px at 80% -10%, rgba(217,130,53,.10), transparent 60%), radial-gradient(900px 500px at -10% 100%, rgba(91,58,36,.10), transparent 55%); } /* ---------- Header ---------- */ header{ position:sticky;top:0;z-index:50; background:rgba(251,246,238,.82); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); } .nav{display:flex;align-items:center;justify-content:space-between;height:84px;gap:20px} .brand{display:flex;align-items:center;gap:14px;cursor:pointer} .brand-mark{ width:48px;height:48px;border-radius:50%;flex:none;overflow:hidden; box-shadow:0 2px 10px -3px rgba(49,28,16,.5); } .brand-mark img{width:100%;height:100%;object-fit:cover} .brand-text{font-family:var(--display);font-size:22px;font-weight:400;color:var(--brown-deep);line-height:1.05;letter-spacing:.01em} .brand-text b{font-weight:400;font-style:italic;font-family:var(--serif);color:var(--terracotta)} .brand-text small{display:block;font-family:var(--sans);font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-top:6px} .menu{display:flex;gap:2px;align-items:center} .menu a{ font-family:var(--sans);font-size:15px;font-weight:400;letter-spacing:.01em; padding:10px 16px;border-radius:4px;color:var(--brown); transition:.25s;position:relative; } .menu a:hover{color:var(--terracotta)} .menu a.active{color:var(--terracotta);font-weight:500} .menu a.active::after{content:"";position:absolute;left:16px;right:16px;bottom:6px;height:1.5px;background:var(--terracotta)} .burger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px} .burger span{width:24px;height:2px;background:var(--brown-deep);border-radius:2px;transition:.3s} /* ---------- Pages ---------- */ /* Reliquat de la maquette single-page : les écrans étaient masqués puis révélés en JS. Plus de bascule ici — et surtout, body_class() pose la classe « page » sur le de toute page WordPress, donc .page{display:none} masquait le site entier. */ .site-main{animation:fade .5s ease} @keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} /* ---------- Hero ---------- */ .hero{position:relative;overflow:hidden;padding:76px 0 88px} .hero-head{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:end;margin-bottom:52px} .hero-lead-col{align-self:start} .eyebrow{display:inline-block;font-family:var(--sans);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--terracotta);font-weight:600;margin-bottom:22px} .hero h1{font-size:clamp(46px,5.6vw,84px);color:var(--brown-deep);font-weight:400;letter-spacing:-.01em;line-height:1.02} .hero h1 em{display:block;font-family:var(--serif);font-style:italic;color:var(--terracotta);font-weight:400;font-size:.86em;letter-spacing:-.01em;margin:6px 0 0;line-height:1.04} .hero-side-col{padding-bottom:8px;border-left:1px solid var(--line);padding-left:38px} .hero p.lead{font-family:var(--serif);font-size:18px;color:var(--brown-mid);margin:0 0 28px;line-height:1.62} .hero-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:44px;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .hero-meta div{display:flex;flex-direction:column;gap:6px} .hm-k{font-family:var(--sans);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:600} .hm-v{font-family:var(--display);font-size:19px;color:var(--brown-deep)} .btn-row{display:flex;gap:14px;flex-wrap:wrap} .btn{ display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:600;font-size:14px;cursor:pointer; letter-spacing:.02em; padding:15px 28px;border-radius:3px;border:none;transition:.25s; } .btn-primary{background:var(--brown-deep);color:var(--paper);box-shadow:var(--shadow)} .btn-primary:hover{background:var(--terracotta);transform:translateY(-2px)} .btn-ghost{background:transparent;color:var(--brown);border:1.5px solid var(--brown)} .btn-ghost:hover{background:var(--brown);color:var(--paper)} /* video block */ .video-wide{ position:relative;border-radius:8px;overflow:hidden;aspect-ratio:16/8;width:100%; background:linear-gradient(160deg,#6b452b,#3d2516);box-shadow:var(--shadow); display:grid;place-items:center;border:1px solid rgba(207,111,41,.3);cursor:pointer; } .video-wide .grain{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E")} .video-wide .label{position:absolute;top:24px;left:26px;font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--orange-soft);font-weight:600} .play{ width:84px;height:84px;border-radius:50%;background:var(--terracotta); display:grid;place-items:center;cursor:pointer;transition:.3s;border:none; box-shadow:0 0 0 0 rgba(168,69,31,.55);animation:pulse 2.6s infinite; } .play:hover{transform:scale(1.08)} .play svg{width:30px;height:30px;margin-left:5px;fill:#fff} @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(168,69,31,.5)}70%{box-shadow:0 0 0 24px rgba(168,69,31,0)}100%{box-shadow:0 0 0 0 rgba(168,69,31,0)}} .video-wide .cap{position:absolute;bottom:24px;left:26px;right:26px;color:#f3e4cf;font-family:var(--serif);font-size:19px;font-style:italic;line-height:1.4} /* stats / values strip */ .strip{background:var(--brown-deep);color:var(--cream);padding:34px 0;position:relative} .strip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center} .strip .n{font-family:var(--display);font-size:46px;color:var(--orange-soft);font-weight:400;line-height:.9} .strip .t{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d8c4ab;margin-top:8px;font-weight:600} /* section base */ section.block{padding:84px 0} .section-head{max-width:640px;margin-bottom:48px} .section-head .eyebrow{margin-bottom:14px} .section-head h2{font-size:clamp(32px,4vw,48px);color:var(--brown-deep);font-weight:400;letter-spacing:0} .section-head p{font-family:var(--serif);color:var(--brown-mid);font-size:18px;margin-top:18px;line-height:1.55} /* savoir-faire cards */ .feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:feat} .feat{ background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:34px; transition:.3s;position:relative;overflow:hidden; } .feat::before{content:counter(feat,decimal-leading-zero);counter-increment:feat;position:absolute;top:18px;right:22px;font-family:var(--display);font-size:34px;color:var(--beige-2);transition:.3s} .feat:hover::before{color:var(--orange-soft)} .feat:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--orange-soft)} .feat .ic{width:56px;height:56px;border-radius:8px;background:var(--beige-2);display:grid;place-items:center;margin-bottom:22px;color:var(--brown)} .feat .ic svg{width:28px;height:28px;stroke:var(--brown);fill:none;stroke-width:1.6} .feat h3{font-size:23px;color:var(--brown-deep);margin-bottom:12px;font-weight:400;letter-spacing:0} .feat p{font-family:var(--serif);color:var(--brown-mid);font-size:16px;line-height:1.55} /* story split */ .story{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center} .story-img{border-radius:22px;overflow:hidden;aspect-ratio:5/6;box-shadow:var(--shadow);position:relative;background:linear-gradient(150deg,#d9b78a,#8a5a36)} .story-img .ph{position:absolute;inset:0;display:grid;place-items:center;color:#fff7ec;font-family:var(--serif);font-style:italic;font-size:20px;text-align:center;padding:30px;background:linear-gradient(160deg,rgba(91,58,36,.15),rgba(61,37,22,.55))} .story h2{font-size:clamp(30px,3.8vw,46px);color:var(--brown-deep);margin-bottom:22px;font-weight:400;letter-spacing:0;line-height:1.05} .story p{font-family:var(--serif);color:var(--brown-mid);margin-bottom:16px;font-size:17px;line-height:1.6} .signature{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--terracotta);margin-top:24px} /* CTA band */ .cta-band{background:var(--brown-deep);color:#fff;border-radius:8px;padding:64px;text-align:center;position:relative;overflow:hidden;margin:40px 0;border:1px solid rgba(224,154,79,.3)} .cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 360px at 70% -20%,rgba(207,111,41,.35),transparent 60%)} .cta-band>*{position:relative} .cta-band h2{font-size:clamp(30px,4vw,46px);color:#fff;font-weight:400;letter-spacing:0} .cta-band p{font-family:var(--serif);max-width:50ch;margin:18px auto 30px;color:#e8d6bf;font-size:18px} .cta-band .btn-primary{background:var(--terracotta)} .cta-band .btn-primary:hover{background:var(--orange)} /* ---------- Product cards ---------- */ .page-head{padding:64px 0 40px;text-align:center} .page-head .eyebrow{justify-content:center} .page-head h1{font-size:clamp(42px,5.5vw,74px);color:var(--brown-deep);font-weight:400;letter-spacing:0;line-height:1} .page-head p{font-family:var(--serif);color:var(--brown-mid);max-width:58ch;margin:20px auto 0;font-size:18px;line-height:1.55} .filters{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:40px} .filters button{ background:transparent;border:2px solid var(--line);color:var(--brown); padding:9px 20px;border-radius:4px;cursor:pointer;font-family:var(--sans);font-weight:600;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;transition:.25s; } .filters button:hover{border-color:var(--terracotta);color:var(--terracotta)} .filters button.active{background:var(--brown-deep);color:var(--cream);border-color:var(--brown-deep)} .prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding-bottom:80px} .card{ background:var(--paper);border:1px solid var(--line);border-radius:6px;overflow:hidden; display:flex;flex-direction:column;transition:.3s; } .card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--orange-soft)} .card .img{ aspect-ratio:4/3;position:relative;overflow:hidden; background:linear-gradient(150deg,var(--c1,#c89a6b),var(--c2,#6b452b)); display:grid;place-items:center; } .card .img .ph-mark{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;font-family:var(--serif);font-style:italic;font-size:22px;color:rgba(255,247,236,.92);letter-spacing:-.01em} .card .img .ph-label{position:absolute;bottom:12px;left:12px;font-family:var(--sans);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.85);background:rgba(49,28,16,.5);padding:5px 10px;border-radius:3px;backdrop-filter:blur(4px);font-weight:600} .tag{position:absolute;top:14px;left:14px;background:var(--terracotta);color:#fff;font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:3px} .card .body{padding:26px;display:flex;flex-direction:column;flex:1} .card h3{font-size:24px;color:var(--brown-deep);margin-bottom:10px;font-weight:400;letter-spacing:0;line-height:1.05} .card .desc{font-family:var(--serif);font-size:15.5px;color:var(--brown-mid);flex:1;margin-bottom:16px;line-height:1.5} .card .make{font-family:var(--serif);font-size:13px;color:var(--muted);border-left:2px solid var(--orange-soft);padding-left:12px;margin-bottom:20px;font-style:italic} .card .foot{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:auto} .price{font-family:var(--display);font-size:30px;color:var(--brown-deep);font-weight:500;line-height:1;letter-spacing:-.01em} .price small{display:block;font-size:11px;color:var(--muted);font-family:var(--sans);font-weight:500;letter-spacing:.04em;text-transform:uppercase;margin-top:6px} /* ---------- Partners ---------- */ .partners-list{display:grid;gap:32px;padding-bottom:60px} .partner{ display:grid;grid-template-columns:.9fr 1.4fr;gap:36px;align-items:center; background:var(--paper);border:1px solid var(--line);border-radius:6px;overflow:hidden; } .partner:nth-child(even){grid-template-columns:1.4fr .9fr} .partner:nth-child(even) .p-img{order:2} .p-img{aspect-ratio:5/4;background:linear-gradient(150deg,var(--c1,#a8c08a),var(--c2,#5d7a3e));position:relative;display:grid;place-items:center;min-height:240px} .p-img .ph-mark{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:30px;font-family:var(--serif);font-style:italic;font-size:24px;color:rgba(255,247,236,.92)} .p-body{padding:44px} .p-body .loc{font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--terracotta);font-weight:700;margin-bottom:12px} .p-body h3{font-size:30px;color:var(--brown-deep);margin-bottom:16px;font-weight:400;letter-spacing:0;line-height:1.05} .p-body p{font-family:var(--serif);color:var(--brown-mid);margin-bottom:12px;font-size:17px;line-height:1.55} .p-body .quote{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--brown);border-left:3px solid var(--terracotta);padding-left:18px;margin-top:18px;line-height:1.5} .p-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px} .p-tags span{font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--brown-mid);background:var(--beige-2);padding:5px 11px;border-radius:3px} .accordion-btn{ display:inline-flex;align-items:center;gap:8px;margin-top:22px;cursor:pointer; background:transparent;border:2px solid var(--brown);color:var(--brown); font-family:var(--sans);font-weight:700;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase; padding:11px 20px;border-radius:4px;transition:.25s; } .accordion-btn:hover{background:var(--brown);color:var(--paper)} .accordion-btn svg{width:16px;height:16px;transition:transform .3s} .accordion-panel{max-height:0;overflow:hidden;transition:max-height .4s ease} .accordion-inner{padding-top:20px} .accordion-inner p{font-family:var(--serif);color:var(--brown-mid);font-size:16px;line-height:1.6;margin-bottom:12px} .accordion-inner .p-site{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--terracotta);letter-spacing:.02em} /* ---------- Footer ---------- */ footer{background:var(--brown-deep);color:#e9d8c2;padding:64px 0 30px;margin-top:40px} .foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;margin-bottom:46px} .foot-grid h4{font-family:var(--sans);color:var(--orange-soft);font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:18px;font-weight:700} .foot-grid p,.foot-grid a{font-family:var(--serif);color:#cbb59a;font-size:15px;display:block;margin-bottom:9px;transition:.2s} .foot-grid a:hover{color:#fff} .foot-brand .brand-text{color:#f3e4cf} .foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:13px;color:#a8917a} /* ---------- Order checkout form ---------- */ .checkout-page{max-width:560px;margin:0 auto} .form-card{background:var(--cream);border:1px solid var(--line);border-radius:22px;padding:36px;box-shadow:var(--shadow)} .field{margin-bottom:18px} .field label{display:block;font-size:13px;font-weight:600;color:var(--brown);margin-bottom:7px} .field input,.field select,.field textarea{ width:100%;padding:13px 16px;border:1px solid var(--line);border-radius:12px;background:#fff; font-family:var(--sans);font-size:15px;color:var(--ink);transition:.2s; } .field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(217,130,53,.15)} .two{display:grid;grid-template-columns:1fr 1fr;gap:16px} .order-success{text-align:center;padding:50px 30px} .order-success .check{width:80px;height:80px;border-radius:50%;background:#4f7a3a;display:grid;place-items:center;margin:0 auto 24px} .order-success .check svg{width:40px;height:40px;stroke:#fff;fill:none;stroke-width:3} /* ---------- Contact ---------- */ .contact-page{padding-bottom:90px} .contact-grid{display:grid;grid-template-columns:1.4fr .9fr;gap:48px;align-items:start} .contact-form-col .form-card{border-radius:8px} .contact-aside{display:flex;flex-direction:column;gap:30px;padding-top:6px} .aside-block{border-top:1px solid var(--line);padding-top:18px} .aside-block:first-child{border-top:none;padding-top:0} .aside-head{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--terracotta);font-weight:600;margin-bottom:10px} .aside-block p{font-family:var(--serif);font-size:17px;color:var(--brown-deep);line-height:1.5} .aside-block a{color:var(--brown-deep);border-bottom:1px solid var(--line);transition:.2s} .aside-block a:hover{color:var(--terracotta);border-color:var(--terracotta)} .aside-hours{list-style:none} .aside-hours li{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line)} .aside-hours li:last-child{border-bottom:none} .aside-hours li span:first-child{font-family:var(--sans);font-size:13.5px;color:var(--brown);font-weight:500} .aside-hours li span:last-child{font-family:var(--sans);font-size:13px;color:var(--brown-mid);text-align:right} .aside-hours .closed{font-style:italic;color:var(--muted)} .form-error{font-family:var(--sans);font-size:13.5px;color:var(--terracotta);font-weight:500;margin-bottom:14px;padding:10px 14px;background:rgba(168,69,31,.08);border-radius:6px;border-left:3px solid var(--terracotta)} /* ---------- Horaires ---------- */ .hours-wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start} .hours-intro h2{font-size:clamp(30px,3.8vw,46px);color:var(--brown-deep);font-weight:400;margin-bottom:18px;letter-spacing:0} .hours-intro p{font-family:var(--serif);color:var(--brown-mid);font-size:18px;line-height:1.6;margin-bottom:30px} .contact-block{border-top:1px solid var(--line)} .contact-row{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);align-items:baseline} .contact-row .ck{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)} .contact-row .cv{font-family:var(--serif);font-size:17px;color:var(--brown-deep)} .contact-row .cv a{color:var(--terracotta)} .contact-row .cv a:hover{text-decoration:underline} .hours-list-head{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-bottom:14px;border-bottom:2px solid var(--brown-deep);margin-bottom:4px} .hours-list ul{list-style:none} .hours-list li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)} .hours-list li:last-child{border-bottom:none} .hours-list .d{font-family:var(--serif);font-size:18px;color:var(--brown-deep);font-weight:500} .hours-list .h{font-family:var(--sans);font-size:14px;color:var(--brown-mid);text-align:right;letter-spacing:.01em} .hours-list .h.closed{color:var(--muted);font-style:italic} /* ---------- Responsive ---------- */ @media(max-width:900px){ .hero-head,.story,.partner,.partner:nth-child(even),.hours-wrap,.contact-grid{grid-template-columns:1fr;gap:30px} .hero-side-col{border-left:none;padding-left:0} .hero-meta{grid-template-columns:1fr 1fr;gap:22px} .partner:nth-child(even) .p-img{order:0} .feat-grid,.prod-grid{grid-template-columns:1fr 1fr} .strip-grid{grid-template-columns:1fr 1fr;gap:30px} .foot-grid{grid-template-columns:1fr 1fr} .menu,.desktop-cart{display:none} .burger{display:flex} .mobile-menu{display:flex} } @media(max-width:560px){ .feat-grid,.prod-grid,.two,.strip-grid,.foot-grid{grid-template-columns:1fr} .cta-band{padding:40px 24px} .p-body,.form-card{padding:26px} .hero{padding:40px 0 60px} section.block{padding:60px 0} .brand-text{font-size:17px} .brand-text small{letter-spacing:.2em} .brand-mark{width:42px;height:42px} } /* mobile menu */ .mobile-menu{ display:none;position:fixed;top:84px;left:0;right:0;background:var(--cream); border-bottom:1px solid var(--line);flex-direction:column;padding:14px 24px;z-index:49; transform:translateY(-130%);transition:.35s;box-shadow:var(--shadow); } .mobile-menu.open{transform:translateY(0)} .mobile-menu a{padding:14px 8px;border-bottom:1px solid var(--line);font-weight:500;color:var(--brown)} .mobile-menu a:last-child{border:none} .mobile-menu a.active{color:var(--orange)} /* ---------- Boutons de formulaire ---------- */ .submit{width:100%;justify-content:center;background:var(--orange);color:#fff} .submit:hover{background:#c9722a} .form-note{font-size:12px;color:var(--muted);text-align:center;margin-top:12px} /* ---------- Adaptations WordPress ---------- */ /* Les menus sont des