/* ========================================================================== Domaine Ameillaud — feuille de style unique ⚠ Ne jamais utiliser comme sélecteur un mot que WordPress ajoute au via body_class() : home, blog, page, single, archive, category, search, search-results, error404, paged, attachment, privacy-policy, logged-in, admin-bar… La règle s'appliquerait alors à la page entière. Préfixer en .da-* au moindre doute. Tokens et mesures reprises de la maquette de référence (Claude Design). ========================================================================== */ /* ---------- Polices auto-hébergées ---------- */ @font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap; src:url(../fonts/dm-sans-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:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap; src:url(../fonts/dm-sans-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:600 700;font-display:swap; src:url(../fonts/source-serif-4-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:600 700;font-display:swap; src:url(../fonts/source-serif-4-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;} /* ---------- Tokens ---------- */ :root{ --ink:#24222A; --text-2:#46434E; --muted:#5E5B66; --slate:#57535F; --lime:#B3D80F; --olive:#A3BA16; --green-text:#4D6A00; --green-deep:#3E5600; --lime-soft:#F4F7E3; --lime-pale:#DDEB9C; --bg:#FAFAF7; --surface:#FFFFFF; --alt:#F1F2EC; --border:#E3E4DC; --border-2:#D6D8CD; --hair:#EDEEE7; --footer-bg:#24222A; --footer-border:#3B3842; --footer-text:#E9E8EC; --footer-dim:#C9C7CF; --footer-dim-2:#AEACB5; --hatch-a:#ECEEE5; --hatch-b:#E3E6DA; --hatch-ink:#5E6252; --serif:'Source Serif 4',Georgia,'Times New Roman',serif; --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --pad:clamp(16px,4vw,32px); --wide:1200px; --read:720px; --r-pill:999px; --r-12:12px; --r-14:14px; --r-18:18px; --r-22:22px; --r-28:28px; } /* ---------- Reset ---------- */ *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%} html,body{margin:0;padding:0} body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6; -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden} img,svg,video{max-width:100%} img{height:auto} a{color:var(--green-text);text-decoration-thickness:1px;text-underline-offset:3px} a:hover{color:var(--ink)} button{font-family:inherit} :focus-visible{outline:2px solid var(--green-text);outline-offset:2px} [hidden]{display:none!important} @media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}} .site{min-height:100vh;display:flex;flex-direction:column} .site-main{flex:1} .wrap{max-width:var(--wide);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)} .skip-link{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:#fff; padding:8px 12px;border-radius:8px;text-decoration:none;font-weight:700} .skip-link:focus{left:8px;color:#fff} .u-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} .leaf{width:12px;height:12px;border-radius:0 100% 0 100%;background:var(--lime);flex:none} /* ---------- Header ---------- */ .site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96); -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)} .header-bar{max-width:var(--wide);margin:0 auto;padding:10px clamp(16px,4vw,24px); display:flex;align-items:center;justify-content:space-between;gap:12px} .icon-btn{width:44px;height:44px;flex:none;border:1px solid var(--border);border-radius:var(--r-12); background:var(--surface);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink)} .icon-btn:hover{border-color:var(--ink)} .icon-btn--menu{flex-direction:column;gap:4px} .icon-btn--menu span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px} .icon-btn--menu span:last-child{width:12px;margin-right:6px} .icon-btn--close{font-size:22px;line-height:1} .site-logo{display:flex} .site-logo img{display:block;width:clamp(136px,30vw,168px);height:auto;aspect-ratio:1536/742;object-fit:contain} .nav-cats{max-width:var(--wide);margin:0 auto;padding:0 clamp(16px,4vw,24px) 10px; display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none} .nav-cats::-webkit-scrollbar,.tabs::-webkit-scrollbar{display:none} .nav-cats a{flex:none;padding:6px 12px;border-radius:var(--r-pill);font-size:15px;font-weight:500; color:var(--ink);text-decoration:none;white-space:nowrap} .nav-cats a:hover{background:var(--alt)} .nav-cats a.is-all{font-weight:700;background:var(--lime)} .nav-cats a.is-current{background:var(--ink);color:#fff} /* ---------- Accueil : bandeau ---------- */ .wrap.da-home{display:flex;flex-direction:column;gap:clamp(48px,6vw,80px); padding-top:clamp(16px,3vw,32px);padding-bottom:72px} .hero-banner{position:relative;overflow:hidden;background:var(--slate);color:#fff; border-radius:var(--r-28);padding:clamp(28px,5vw,64px);display:flex;flex-direction:column;gap:22px} .hero-banner>*{position:relative} .hero-leaf{position:absolute;aspect-ratio:1} .hero-leaf--1{right:-40px;top:-50px;width:clamp(140px,22vw,300px);border-radius:0 100% 0 100%; background:var(--lime);transform:rotate(-8deg)} .hero-leaf--2{right:clamp(90px,16vw,230px);top:clamp(-30px,-2vw,-10px);width:clamp(70px,10vw,140px); border-radius:0 100% 0 100%;background:var(--olive);transform:rotate(24deg)} .hero-leaf--3{right:clamp(20px,6vw,90px);bottom:-60px;width:clamp(90px,14vw,190px); border-radius:100% 0 100% 0;background:var(--lime);opacity:.85} .hero-kicker{margin:0;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lime-pale)} .hero-title{margin:0;max-width:16ch;font-family:var(--serif);font-weight:700; font-size:clamp(34px,5.4vw,64px);line-height:1.05;text-wrap:balance} .hero-title em{font-style:normal;color:var(--lime)} .search-trigger{align-self:stretch;max-width:560px;height:60px;border:0;border-radius:var(--r-pill); background:#fff;color:var(--muted);font:inherit;font-size:17px;display:flex;align-items:center;gap:12px; padding:0 8px 0 22px;cursor:pointer;text-align:left} .search-trigger:hover{box-shadow:0 0 0 4px rgba(179,216,15,.6)} .search-trigger .st-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .search-trigger .st-cta{flex:none;height:44px;padding:0 20px;border-radius:var(--r-pill); background:var(--lime);color:var(--ink);font-weight:700;display:flex;align-items:center} .hero-chips{display:flex;flex-wrap:wrap;gap:8px;max-width:760px} .hero-chips a{padding:8px 14px;border-radius:var(--r-pill);border:1px solid rgba(255,255,255,.35); color:#fff;text-decoration:none;font-size:15px;font-weight:500} .hero-chips a:hover{background:#fff;color:var(--ink)} /* ---------- Titres de section ---------- */ .sec-title{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:600; font-size:clamp(24px,2.6vw,32px);line-height:1.2;margin:0} .sec-title--center{justify-content:center} .sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px} .sec-head .more{font-size:15px;font-weight:700;white-space:nowrap} /* ---------- À la une + incontournables ---------- */ .feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:clamp(28px,4vw,56px);align-items:start} .feature{display:flex;flex-direction:column;gap:18px;color:inherit;text-decoration:none} .feature:hover{color:var(--green-text)} .feature .thumb{border-radius:var(--r-22);aspect-ratio:16/10} .feature-body{display:flex;flex-direction:column;gap:10px} .feature-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap} .badge{background:var(--lime);color:var(--ink);font-size:12px;font-weight:700;letter-spacing:.04em; text-transform:uppercase;padding:4px 10px;border-radius:var(--r-pill);text-decoration:none;display:inline-block} .dim{font-size:14px;color:var(--muted)} .feature h2{font-family:var(--serif);font-weight:700;font-size:clamp(28px,3.2vw,40px); line-height:1.15;margin:0;text-wrap:balance} .feature p{margin:0;color:var(--text-2);font-size:clamp(17px,1.6vw,19px);line-height:1.55;text-wrap:pretty} .must{display:flex;flex-direction:column;gap:6px} .must ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column} .must li{border-bottom:1px solid var(--border)} .must a{display:flex;gap:18px;align-items:baseline;padding:18px 0;color:inherit;text-decoration:none} .must a:hover{color:var(--green-text)} .must .num{flex:none;width:44px;font-family:var(--serif);font-weight:700;font-size:34px;line-height:1;color:var(--olive)} .must .txt{min-width:0;display:flex;flex-direction:column;gap:4px} .must .t{font-size:clamp(17px,1.5vw,19px);line-height:1.3;font-weight:700;text-wrap:pretty} .cat-label{font-size:13px;font-weight:700;color:var(--green-text);text-transform:uppercase;letter-spacing:.04em} /* ---------- Cartes article ---------- */ .card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:32px 24px} .card-grid--list{gap:36px 24px;padding-top:8px} .card{display:flex;flex-direction:column;gap:12px;color:inherit;text-decoration:none} .card:hover{color:var(--green-text)} .card .thumb{aspect-ratio:16/10;border-radius:var(--r-14)} .card-body{display:flex;flex-direction:column;gap:6px} .card-title{margin:0;font-size:clamp(17px,1.6vw,20px);line-height:1.3;font-weight:700; font-family:var(--sans);text-wrap:pretty} .thumb{position:relative;width:100%;overflow:hidden;background:var(--alt);display:block} .thumb img{width:100%;height:100%;object-fit:cover;display:block} .thumb--empty{background:repeating-linear-gradient(135deg,var(--hatch-a) 0 8px,var(--hatch-b) 8px 16px); display:flex;align-items:center;justify-content:center} .thumb--empty::after{content:"";width:34%;max-width:64px;aspect-ratio:1; border-radius:0 100% 0 100%;background:var(--lime);opacity:.5} .section-stack{display:flex;flex-direction:column;gap:24px} /* ---------- Blocs rubrique ---------- */ .blocks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px} .block{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--border); border-radius:var(--r-22);padding:clamp(20px,2.4vw,28px)} .block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:6px} .block-head .sec-title{font-size:24px} .round-arrow{flex:none;width:40px;height:40px;border-radius:50%;background:var(--lime-soft); display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--ink);font-weight:700} .round-arrow:hover{background:var(--lime);color:var(--ink)} .block-list{display:flex;flex-direction:column} .block-list a{display:block;padding:14px 0;border-top:1px solid var(--hair);color:inherit; text-decoration:none;font-weight:700;font-size:17px;line-height:1.35;text-wrap:pretty} .block-list a:hover{color:var(--green-text)} /* ---------- Tuiles « Explorer par rubrique » ---------- */ .tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:12px} .tile{flex:0 0 auto;width:clamp(150px,calc(20% - 10px),240px);min-height:96px;padding:18px; border-radius:var(--r-18);text-decoration:none;font-weight:700;font-size:18px; display:flex;align-items:flex-end;justify-content:space-between;gap:8px;transition:transform .15s ease} .tile:hover{transform:translateY(-2px)} .tile--lime{background:var(--lime);color:var(--ink)} .tile--lime:hover{color:var(--ink)} .tile--slate{background:var(--slate);color:#fff} .tile--slate:hover{color:#fff} .tile--slate .arrow{color:var(--lime)} .tile--light{background:var(--surface);border:1px solid var(--border);color:var(--ink)} .tile--light:hover{border-color:var(--ink);color:var(--ink)} .tile--light .arrow{color:var(--green-text)} /* ---------- Listings (blog, catégorie, recherche) ---------- */ .listing{padding-top:clamp(20px,4vw,40px);padding-bottom:72px;display:flex;flex-direction:column;gap:28px} .crumbs{font-size:14px;color:var(--muted);display:flex;gap:6px;flex-wrap:wrap} .crumbs span[aria-current]{color:var(--muted)} .listing-head{display:flex;flex-direction:column;gap:12px} .listing-head h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,4.4vw,44px);line-height:1.1;margin:0} .listing-head .intro{margin:0;max-width:62ch;color:var(--text-2);font-size:clamp(17px,2vw,19px);text-wrap:pretty} .listing-head .intro p{margin:0 0 12px} .listing-head .intro p:last-child{margin-bottom:0} .subchips{display:flex;flex-wrap:wrap;gap:8px} .subchips a{padding:8px 14px;border:1px solid var(--border-2);border-radius:var(--r-pill); background:var(--surface);color:var(--ink);text-decoration:none;font-size:15px;font-weight:500} .subchips a:hover{border-color:var(--ink);color:var(--ink)} .tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none; margin:0 calc(-1 * clamp(16px,4vw,24px));padding:0 clamp(16px,4vw,24px)} .tabs a{flex:none;padding:8px 14px;border-radius:var(--r-pill);border:1px solid var(--border-2); background:var(--surface);color:var(--ink);font-size:15px;font-weight:500;text-decoration:none;white-space:nowrap} .tabs a:hover{border-color:var(--ink);color:var(--ink)} .tabs a[aria-current]{border-color:var(--ink);background:var(--ink);color:#fff;font-weight:700} .empty{padding:32px 0;margin:0;color:var(--muted)} /* ---------- Pagination ---------- */ .pagination{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap} .pagination .page-numbers{min-width:44px;height:44px;display:flex;align-items:center;justify-content:center; border-radius:var(--r-12);border:1px solid var(--border-2);background:var(--surface);color:var(--ink); text-decoration:none;font-weight:500} .pagination .page-numbers:hover{border-color:var(--ink);color:var(--ink)} .pagination .page-numbers.current{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:700} .pagination .page-numbers.dots{border:0;background:none;color:var(--muted);min-width:auto;padding:0 4px} .pagination .next,.pagination .prev{width:auto;padding:0 16px;border-color:var(--ink);font-weight:700} /* ---------- Article ---------- */ .entry{max-width:var(--read);margin:0 auto;padding:clamp(20px,4vw,40px) clamp(16px,4vw,24px) 64px; display:flex;flex-direction:column;gap:24px} .entry-header{display:flex;flex-direction:column;gap:16px} .entry-header .badge{align-self:flex-start} .entry-title{font-family:var(--serif);font-weight:700;font-size:clamp(28px,4.6vw,42px); line-height:1.15;margin:0;text-wrap:balance} .entry-lead{margin:0;font-size:clamp(18px,2.2vw,20px);line-height:1.5;font-weight:500; color:var(--text-2);text-wrap:pretty} .byline{display:flex;align-items:center;gap:12px;padding-top:4px} .avatar{width:44px;height:44px;border-radius:50%;background:var(--slate);color:#fff;display:flex; align-items:center;justify-content:center;font-weight:700;flex:none;overflow:hidden} .avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%} .byline-txt{font-size:14px;line-height:1.4;color:var(--muted)} .byline-txt a{font-weight:700;color:var(--ink)} .entry-figure{margin:0;display:flex;flex-direction:column;gap:8px} .entry-figure .thumb{aspect-ratio:3/2;border-radius:var(--r-18)} .entry-figure figcaption{font-size:13px;color:var(--muted)} .tldr{background:var(--lime-soft);border-radius:var(--r-18);padding:clamp(18px,3vw,24px); display:flex;flex-direction:column;gap:10px} .tldr-label{margin:0;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--green-deep)} .tldr ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:17px;line-height:1.5} .toc{border:1px solid var(--border);border-radius:var(--r-18);background:var(--surface)} .toc>button{width:100%;min-height:52px;padding:0 20px;display:flex;align-items:center; justify-content:space-between;background:none;border:0;font:inherit;font-weight:700;font-size:16px; color:var(--ink);cursor:pointer} .toc .sign{font-size:20px;line-height:1} .toc ol{margin:0;padding:0 20px 18px 40px;display:flex;flex-direction:column;gap:6px;font-size:16px} .entry-content{font-size:clamp(17px,2vw,18px);line-height:1.7;text-wrap:pretty} .entry-content>*{margin:0 0 18px} .entry-content>*:last-child{margin-bottom:0} .entry-content h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3vw,30px); line-height:1.2;margin:36px 0 18px;scroll-margin-top:120px} .entry-content h3{font-family:var(--sans);font-weight:700;font-size:clamp(19px,2.4vw,22px); line-height:1.3;margin:26px 0 18px;scroll-margin-top:120px} .entry-content h4{font-size:18px;font-weight:700;margin:22px 0 14px} .entry-content ul,.entry-content ol{padding-left:22px;display:flex;flex-direction:column;gap:8px} .entry-content li>ul,.entry-content li>ol{margin-top:8px} .entry-content img{border-radius:var(--r-14);height:auto} .entry-content figure{margin:0 0 18px} .entry-content figcaption{font-size:13px;color:var(--muted);margin-top:8px} .entry-content blockquote{margin:0 0 18px;padding:16px 20px;background:var(--lime-soft); border-radius:var(--r-14);font-size:17px} .entry-content blockquote>*:last-child{margin-bottom:0} .entry-content a{color:var(--green-text);text-decoration:underline} .entry-content a:hover{color:var(--ink)} .entry-content hr{border:0;border-top:1px solid var(--border);margin:32px 0} .entry-content code{background:var(--alt);padding:2px 6px;border-radius:6px;font-size:.9em} .table-scroll{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-14); background:var(--surface);margin:0 0 18px} .table-scroll table,.entry-content table{border-collapse:collapse;width:100%;min-width:520px; font-size:15px;line-height:1.45} .entry-content th{background:var(--alt);text-align:left;padding:12px 14px;font-weight:700} .entry-content td{padding:12px 14px;border-top:1px solid var(--border)} .faq{display:flex;flex-direction:column;gap:10px} .faq>h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3vw,30px);line-height:1.2;margin:18px 0 6px} .faq-item{border:1px solid var(--border);border-radius:var(--r-14);background:var(--surface)} .faq-item h3{margin:0;font-size:17px;font-family:var(--sans)} .faq-item button{width:100%;min-height:52px;padding:12px 18px;display:flex;align-items:center; justify-content:space-between;gap:12px;background:none;border:0;font:inherit;font-weight:700; color:var(--ink);text-align:left;cursor:pointer} .faq-item .sign{font-size:20px;flex:none} .faq-answer{margin:0;padding:0 18px 16px;font-size:16px;line-height:1.6;color:#3A3841} .faq-answer>*:last-child{margin-bottom:0} .sources{display:flex;flex-direction:column;gap:8px;font-size:15px} .sources h2{margin:0;font-size:15px;font-family:var(--sans);font-weight:700;text-transform:uppercase; letter-spacing:.06em;color:var(--muted)} .sources ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px} .sources .updated{margin:4px 0 0;color:var(--muted)} .share{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .share-label{font-size:14px;font-weight:700;margin-right:4px} .share a{padding:8px 14px;border:1px solid var(--border-2);border-radius:var(--r-pill);font-size:14px; color:var(--ink);text-decoration:none;background:var(--surface)} .share a:hover{border-color:var(--ink);color:var(--ink)} .author-box{display:flex;gap:16px;align-items:flex-start;background:var(--surface); border:1px solid var(--border);border-radius:var(--r-18);padding:20px} .author-box .avatar{width:56px;height:56px;font-size:20px} .author-box .meta{display:flex;flex-direction:column;gap:4px;min-width:0} .author-box .name{font-weight:700;color:var(--ink);font-size:17px} .author-box .role{font-size:14px;color:var(--muted)} .author-box .bio{margin:4px 0 0;font-size:15px;line-height:1.55;color:#3A3841} .related{display:flex;flex-direction:column;gap:4px;padding-top:12px} .related h2{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:600; font-size:clamp(22px,2.6vw,26px);line-height:1.2;margin:0 0 4px} .related h2 .leaf{border-radius:50%;width:10px;height:10px} .related a{display:flex;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--border); color:inherit;text-decoration:none} .related a:hover{color:var(--green-text)} .related .thumb{flex:none;width:clamp(80px,22%,140px);aspect-ratio:4/3;border-radius:10px} .related h3{margin:0;font-size:clamp(16px,2vw,18px);line-height:1.35;font-weight:700; font-family:var(--sans);min-width:0} /* ---------- Mention d'affiliation ---------- */ .aff-note{margin:0;font-size:14px;line-height:1.5;color:var(--muted);background:var(--alt); border-radius:var(--r-14);padding:12px 16px} .aff-note a{color:var(--green-text)} /* ---------- Encarts publicitaires (optionnels) ---------- */ .ad-slot{margin:0;min-height:1px;display:flex;justify-content:center} .ad-slot--in-article{margin:8px 0} /* ---------- Pages ---------- */ .page-entry{max-width:var(--read);margin:0 auto;padding:clamp(20px,4vw,40px) clamp(16px,4vw,24px) 64px; display:flex;flex-direction:column;gap:24px} .page-entry.is-wide{max-width:var(--wide)} .page-title{font-family:var(--serif);font-weight:700;font-size:clamp(28px,4.6vw,42px);line-height:1.15;margin:0} /* ---------- Footer ---------- */ .site-footer{background:var(--footer-bg);color:var(--footer-text)} .footer-grid{max-width:var(--wide);margin:0 auto;padding:56px var(--pad) 32px; display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:32px 48px} .footer-brand{display:flex;flex-direction:column;gap:12px} .footer-brand img{display:block;width:180px;height:87px;object-fit:contain} .footer-brand p{margin:0;max-width:48ch;font-size:16px;color:var(--footer-dim)} .footer-col{display:flex;flex-direction:column;gap:12px} .footer-col .label{margin:0;font-size:13px;font-weight:700;text-transform:uppercase; letter-spacing:.06em;color:var(--lime)} .footer-links{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:16px} .footer-links a{color:#fff;text-decoration:none} .footer-links a:hover{text-decoration:underline;color:var(--lime)} .footer-bottom{grid-column:1/-1;border-top:1px solid var(--footer-border);padding-top:20px; display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--footer-dim-2)} .footer-bottom a{color:var(--lime-pale)} /* ---------- Menu mobile ---------- */ .panel{position:fixed;inset:0;z-index:50;background:var(--bg);overflow-y:auto} .panel-inner{max-width:720px;margin:0 auto;padding:10px clamp(16px,4vw,24px) 40px; display:flex;flex-direction:column;gap:16px} .panel-top{display:flex;align-items:center;justify-content:space-between} .panel-top img{display:block;width:clamp(136px,30vw,168px);height:auto;aspect-ratio:1536/742;object-fit:contain} .panel-all{min-height:52px;display:flex;align-items:center;padding:0 16px;border-radius:var(--r-14); background:var(--lime);color:var(--ink);text-decoration:none;font-weight:700;font-size:17px} .panel-nav{display:flex;flex-direction:column;border-top:1px solid var(--border)} .panel-row{border-bottom:1px solid var(--border)} .panel-row .row{display:flex;align-items:center} .panel-row .row>a{flex:1;min-height:52px;display:flex;align-items:center;color:var(--ink); text-decoration:none;font-size:18px;font-weight:500} .panel-row .row>button{width:44px;height:44px;flex:none;border:0;background:none;font-size:22px; color:var(--ink);cursor:pointer} .panel-subs{display:flex;flex-direction:column;padding:0 0 12px 12px} .panel-subs a{min-height:44px;display:flex;align-items:center;color:var(--text-2); text-decoration:none;font-size:16px} /* ---------- Recherche ---------- */ .modal{position:fixed;inset:0;z-index:50;background:rgba(36,34,42,.55);display:flex; justify-content:center;align-items:flex-start;padding:12px} .modal-box{width:100%;max-width:720px;background:var(--surface);border-radius:20px;padding:16px; display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 24px);overflow-y:auto} .search-row{display:flex;gap:8px;align-items:center} .search-row input{flex:1;min-width:0;height:52px;border:1px solid var(--border-2);border-radius:var(--r-14); padding:0 16px;font:inherit;font-size:17px;color:var(--ink);background:var(--bg)} .modal .da-search-results{display:flex;flex-direction:column} .modal .da-search-results a{padding:12px 4px;border-bottom:1px solid var(--hair);color:var(--ink); text-decoration:none;display:flex;flex-direction:column;gap:2px} .modal .da-search-results a:hover{color:var(--green-text)} .modal .da-search-results .c{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--green-text)} .modal .da-search-results .t{font-weight:700;line-height:1.35} .search-note{margin:8px 4px;color:var(--muted)} /* ---------- 404 ---------- */ .notfound{max-width:var(--read);margin:0 auto;padding:clamp(40px,8vw,88px) var(--pad); display:flex;flex-direction:column;gap:20px;align-items:flex-start} /* ---------- Commentaires (masqués par défaut, style minimal) ---------- */ .comments-area{max-width:var(--read);margin:0 auto;padding:0 clamp(16px,4vw,24px) 64px} /* ---------- Blocs affiliation (au langage visuel du site) ---------- */ .btn-buy{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px; padding:0 24px;border:0;border-radius:var(--r-pill);background:var(--lime);color:var(--ink); font:inherit;font-weight:700;font-size:17px;text-decoration:none;cursor:pointer;text-align:center} .btn-buy:hover{background:var(--olive);color:var(--ink)} .aff-cta{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:0 0 18px} .aff-cta-note{font-size:12px;color:var(--muted)} .product-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:20px;align-items:start;background:var(--surface);border:1px solid var(--border); border-radius:var(--r-18);padding:clamp(18px,3vw,24px);margin:0 0 18px} .product-img{background:#fff;border:1px solid var(--hair);border-radius:var(--r-14);padding:12px; display:flex;align-items:center;justify-content:center;aspect-ratio:1} .product-img img{width:100%;height:100%;object-fit:contain;border-radius:0} .product-body{display:flex;flex-direction:column;gap:10px;align-items:flex-start;min-width:0} .product-name{margin:0;font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.4vw,22px);line-height:1.25} .product-meta{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;font-size:15px} .product-note{font-weight:700;font-size:19px} .product-note .dim{font-weight:400;font-size:14px;color:var(--muted)} .product-price{font-weight:700;color:var(--green-text)} .product-sub{margin:0 0 4px;font-size:12px;font-weight:700;text-transform:uppercase; letter-spacing:.06em;color:var(--green-deep)} .product-pros,.product-cons{width:100%} .product-pros ul,.product-cons ul{margin:0;padding-left:18px;display:flex;flex-direction:column; gap:4px;font-size:15px;line-height:1.5} .product-cons .product-sub{color:var(--muted)} .entry-content .product-box>*{margin:0}