/*
Theme Name: Axiome (GeneratePress Child)
Theme URI: https://example.com
Description: Child theme GeneratePress reprenant le design "Axiome" (magazine éditorial chaleureux) — accueil, article, catégorie et page. Basé sur les maquettes fournies.
Author: F
Template: generatepress
Version: 1.0.0
Text Domain: axiome
*/

/* ===========================================================
   Design tokens (repris des maquettes)
   =========================================================== */
:root{
	--ax-bg:            oklch(97% 0.012 75);
	--ax-text:          oklch(24% 0.02 70);
	--ax-text-soft:     oklch(38% 0.02 70);
	--ax-text-softer:   oklch(42% 0.02 70);
	--ax-muted:         oklch(48% 0.02 70);
	--ax-border:        oklch(88% 0.02 70);
	--ax-accent:        oklch(45% 0.13 40);   /* terracotta - Comparatifs / Actualités / CTA */
	--ax-accent-strong: oklch(50% 0.13 40);
	--ax-green:         oklch(45% 0.13 130);  /* Guides */
	--ax-green-soft:    oklch(50% 0.1 130);
	--ax-blue:          oklch(45% 0.08 260);  /* Astuces */
	--ax-footer-bg:     oklch(20% 0.02 70);
	--ax-footer-text:   oklch(85% 0.01 70);
	--ax-footer-muted:  oklch(55% 0.01 70);
	--ax-placeholder-a: oklch(88% 0.03 75);
	--ax-placeholder-b: oklch(82% 0.04 70);
	--ax-font-heading: 'Spectral', Georgia, serif;
	--ax-font-body: 'Work Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}

body{
	margin:0;
	background:var(--ax-bg);
	color:var(--ax-text);
	font-family:var(--ax-font-body);
}
a{ color:inherit; text-decoration:none; }
a:hover{ color:var(--ax-accent); }
img{ max-width:100%; height:auto; display:block; }
.ax-wrap{ max-width:1180px; margin:0 auto; padding-left:40px; padding-right:40px; }

/* ===========================================================
   Header
   =========================================================== */
.ax-header{
	display:flex; align-items:center; justify-content:space-between;
	padding:18px 40px; border-bottom:1px solid var(--ax-border);
	background:var(--ax-bg);
}
.ax-logo{ display:flex; align-items:center; gap:10px; }
.ax-logo-mark{
	width:30px; height:30px; border-radius:50% 50% 50% 0;
	background:oklch(55% 0.15 40); transform:rotate(-45deg); flex:none;
}
.ax-logo-text{ font-family:var(--ax-font-heading); font-weight:700; font-size:22px; color:var(--ax-text); }
.ax-nav{ display:flex; gap:28px; flex-wrap:wrap; }
.ax-nav a{ font-size:14px; font-weight:600; color:var(--ax-text-soft); }
.ax-nav a.current-menu-item,
.ax-nav a:hover{ color:var(--ax-accent); }
.ax-cta{
	font-family:var(--ax-font-body); font-weight:700; font-size:14px;
	color:#fff; background:var(--ax-accent); padding:10px 20px; border-radius:24px;
	display:inline-flex;
}
.ax-cta:hover{ color:#fff; background:var(--ax-accent-strong); }
.ax-menu-toggle{ display:none; }

/* ===========================================================
   Hero (accueil)
   =========================================================== */
.ax-hero{
	display:grid; grid-template-columns:1.15fr .85fr; gap:44px; align-items:center;
	padding:56px 40px 48px;
}
.ax-hero-kicker{
	display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700;
	letter-spacing:.12em; text-transform:uppercase; color:var(--ax-green); margin-bottom:16px;
}
.ax-hero-kicker .dot{ width:14px; height:14px; border-radius:50% 50% 50% 0; background:var(--ax-green-soft); transform:rotate(-45deg); }
.ax-hero h1{
	font-family:var(--ax-font-heading); font-weight:700; font-size:46px; line-height:1.06;
	margin:0 0 18px; color:oklch(20% 0.02 70);
}
.ax-hero p{ font-size:16px; line-height:1.7; color:var(--ax-text-soft); max-width:46ch; margin:0 0 26px; }
.ax-btn{
	display:inline-flex; font-weight:700; font-size:15px; color:#fff;
	background:var(--ax-accent); padding:13px 26px; border-radius:26px;
}
.ax-btn:hover{ color:#fff; background:var(--ax-accent-strong); }
.ax-ph{
	display:flex; align-items:center; justify-content:center; text-align:center;
	color:oklch(45% 0.03 70); font:600 11px ui-monospace,Menlo,monospace;
	background:repeating-linear-gradient(45deg,var(--ax-placeholder-a) 0 14px,var(--ax-placeholder-b) 14px 28px);
	border-radius:18px; overflow:hidden;
}
.ax-hero .ax-ph{ aspect-ratio:4/3; box-shadow:0 20px 40px oklch(30% 0.03 70 / .15); }

/* ===========================================================
   Section titles
   =========================================================== */
.ax-section{ padding:8px 40px 52px; }
.ax-section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:26px; }
.ax-section-head h2{ font-family:var(--ax-font-heading); font-weight:700; font-size:28px; margin:0; }
.ax-section-head a{ font-size:13px; font-weight:600; color:var(--ax-accent); }

/* ===========================================================
   Cards / article previews
   =========================================================== */
.ax-featured-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:24px; }
.ax-card{
	background:#fff; border:1px solid var(--ax-border); border-radius:14px; overflow:hidden; display:block;
}
.ax-card .ax-ph{ aspect-ratio:16/9; border-radius:0; }
.ax-card-body{ padding:22px 24px 26px; }
.ax-badge{
	font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
	color:#fff; background:var(--ax-accent); padding:4px 11px; border-radius:20px; display:inline-block;
}
.ax-badge.cat-guides{ background:var(--ax-green); }
.ax-badge.cat-astuces{ background:var(--ax-blue); }
.ax-card-body h3{
	font-family:var(--ax-font-heading); font-size:23px; font-weight:700; margin:14px 0 8px; line-height:1.2;
}
.ax-card-body p{ font-size:14px; color:var(--ax-text-softer); margin:0; line-height:1.6; }

.ax-side-list{ display:flex; flex-direction:column; gap:16px; }
.ax-side-item{
	display:flex; gap:14px; background:#fff; border:1px solid var(--ax-border); border-radius:12px; padding:14px;
}
.ax-side-item .ax-ph{ width:96px; height:96px; flex:none; border-radius:8px; font-size:9px; }
.ax-side-item .ax-kicker{ font-size:10.5px; font-weight:700; text-transform:uppercase; color:var(--ax-green); }
.ax-side-item .ax-kicker.cat-comparatifs,
.ax-side-item .ax-kicker.cat-actualites{ color:var(--ax-accent); }
.ax-side-item h4{
	font-family:var(--ax-font-heading); font-size:16px; font-weight:700; margin:6px 0 0; line-height:1.3;
}

/* ===========================================================
   Category tiles (accueil)
   =========================================================== */
.ax-cat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.ax-cat-tile{ border-radius:14px; padding:24px; display:block; }
.ax-cat-tile .dot{ width:36px; height:36px; border-radius:10px; display:block; margin-bottom:14px; }
.ax-cat-tile h4{ font-family:var(--ax-font-heading); font-size:19px; font-weight:700; margin:0 0 6px; }
.ax-cat-tile p{ font-size:13.5px; color:var(--ax-text-soft); margin:0; line-height:1.5; }
.ax-cat-tile.tile-green{ background:oklch(93% 0.03 130); } .ax-cat-tile.tile-green .dot{ background:var(--ax-green-soft); }
.ax-cat-tile.tile-terracotta{ background:oklch(93% 0.04 40); } .ax-cat-tile.tile-terracotta .dot{ background:oklch(50% 0.13 40); }
.ax-cat-tile.tile-blue{ background:oklch(93% 0.02 260); } .ax-cat-tile.tile-blue .dot{ background:var(--ax-blue); }

/* ===========================================================
   Popular list (accueil)
   =========================================================== */
.ax-popular-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px 40px; }
.ax-popular-item{
	display:flex; align-items:baseline; gap:16px; padding:16px 0; border-bottom:1px solid var(--ax-border);
}
.ax-popular-item .num{ font-family:var(--ax-font-heading); font-size:24px; font-weight:700; color:oklch(80% 0.02 70); }
.ax-popular-item .title{ font-size:15px; font-weight:600; line-height:1.4; }

/* ===========================================================
   About / CTA split (accueil + page)
   =========================================================== */
.ax-split{
	padding:8px 40px 60px; display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center;
}
.ax-split .ax-ph{ aspect-ratio:4/3; border-radius:16px; }
.ax-split .ax-kicker{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ax-green); }
.ax-split h2{ font-family:var(--ax-font-heading); font-weight:700; font-size:30px; margin:14px 0 16px; line-height:1.15; }
.ax-split p{ font-size:15px; line-height:1.7; color:var(--ax-text-soft); margin:0 0 20px; }
.ax-split .ax-link{ display:inline-flex; font-weight:700; font-size:14px; color:var(--ax-accent); }

/* ===========================================================
   Category archive
   =========================================================== */
.ax-archive-head{ padding:48px 40px 34px; border-bottom:1px solid var(--ax-border); }
.ax-archive-head .ax-kicker{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ax-green); }
.ax-archive-head h1{ font-family:var(--ax-font-heading); font-weight:700; font-size:40px; margin:12px 0 12px; line-height:1.05; }
.ax-archive-head p{ font-size:15px; line-height:1.7; color:var(--ax-text-soft); max-width:60ch; margin:0; }

.ax-archive-grid{ padding:44px 40px 20px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.ax-archive-card{ background:#fff; border:1px solid var(--ax-border); border-radius:14px; overflow:hidden; display:block; }
.ax-archive-card .ax-ph{ aspect-ratio:16/10; border-radius:0; font-size:10px; }
.ax-archive-card .body{ padding:18px 20px 22px; }
.ax-archive-card .badge{
	font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
	color:#fff; background:var(--ax-accent); padding:4px 10px; border-radius:20px; display:inline-block;
}
.ax-archive-card h3{ font-family:var(--ax-font-heading); font-size:19px; font-weight:700; margin:12px 0 8px; line-height:1.25; }
.ax-archive-card .date{ font-size:12px; color:var(--ax-muted); }
.ax-archive-card p{ font-size:13.5px; color:var(--ax-text-softer); margin:8px 0 0; line-height:1.55; }

.ax-pagination{ display:flex; gap:8px; justify-content:center; padding:12px 40px 64px; }
.ax-pagination a, .ax-pagination span{
	display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px;
	padding:0 12px; border:1px solid oklch(85% 0.02 70); border-radius:10px; font-weight:700; font-size:14px;
	color:var(--ax-text-soft);
}
.ax-pagination .current{ background:var(--ax-accent); color:#fff; border-color:var(--ax-accent); }

/* ===========================================================
   Single article
   =========================================================== */
.ax-article-head{ max-width:760px; margin:0 auto; padding:52px 40px 22px; text-align:center; }
.ax-article-head .ax-kicker{ font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ax-accent); }
.ax-article-head h1{
	font-family:var(--ax-font-heading); font-weight:700; font-size:38px; line-height:1.12; margin:14px 0 0;
	color:oklch(20% 0.02 70);
}
.ax-article-meta{
	display:flex; gap:10px; align-items:center; justify-content:center; margin-top:16px;
	font-size:13px; color:var(--ax-muted);
}
.ax-article-meta .sep{ width:4px; height:4px; border-radius:50%; background:oklch(65% 0.02 70); }
.ax-article-figure{ max-width:920px; margin:0 auto 36px; padding:0 40px; }
.ax-article-figure .ax-ph{ aspect-ratio:16/9; border-radius:16px; font-size:12px; }

.ax-article-body{ max-width:700px; margin:0 auto; padding:0 40px 20px; font-size:17px; line-height:1.82; color:oklch(30% 0.02 70); }
.ax-article-body p{ margin:0 0 20px; }
.ax-article-body h2{ font-family:var(--ax-font-heading); font-weight:700; font-size:26px; color:oklch(20% 0.02 70); margin:36px 0 14px; line-height:1.2; }
.ax-article-body h3{ font-family:var(--ax-font-heading); font-weight:700; font-size:21px; color:oklch(20% 0.02 70); margin:30px 0 12px; line-height:1.25; }
.ax-article-body blockquote{
	border-left:3px solid var(--ax-green-soft); padding-left:20px; margin:28px 0;
	font-style:italic; color:var(--ax-text-soft);
}
.ax-article-body ul, .ax-article-body ol{ margin:0 0 20px; padding-left:22px; }
.ax-article-body li{ margin:0 0 8px; }
.ax-article-body img{ border-radius:14px; margin:28px 0; }
.ax-article-body a{ color:var(--ax-accent); text-decoration:underline; }

.ax-article-tags{ max-width:700px; margin:0 auto; padding:24px 40px 60px; display:flex; flex-wrap:wrap; gap:8px; }
.ax-article-tags a{
	font-size:12.5px; color:var(--ax-text-soft); background:#fff; border:1px solid oklch(85% 0.02 70);
	padding:6px 14px; border-radius:20px;
}

/* ===========================================================
   Standard page
   =========================================================== */
.ax-page-head{ max-width:760px; margin:0 auto; padding:52px 40px 22px; }
.ax-page-head .ax-kicker{ font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ax-green); }
.ax-page-head h1{ font-family:var(--ax-font-heading); font-weight:700; font-size:36px; margin:12px 0 0; color:oklch(20% 0.02 70); }
.ax-page-figure{ max-width:720px; margin:0 auto; padding:0 40px 8px; }
.ax-page-figure .ax-ph{ aspect-ratio:16/9; border-radius:16px; margin-bottom:32px; font-size:12px; }
.ax-page-body{ max-width:700px; margin:0 auto; padding:0 40px 20px; font-size:17px; line-height:1.82; color:oklch(30% 0.02 70); }
.ax-page-body p{ margin:0 0 20px; }
.ax-page-body h2{ font-family:var(--ax-font-heading); font-weight:700; font-size:24px; color:oklch(20% 0.02 70); margin:32px 0 14px; line-height:1.2; }
.ax-page-body ul{ margin:0 0 20px; padding-left:22px; }
.ax-page-body li{ margin:0 0 8px; }
.ax-page-body a{ color:var(--ax-accent); text-decoration:underline; }

/* ===========================================================
   Footer
   =========================================================== */
.ax-footer{ background:var(--ax-footer-bg); color:var(--ax-footer-text); padding:48px 40px 0; margin-top:20px; }
.ax-footer-top{
	max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px;
	padding-bottom:32px; border-bottom:1px solid oklch(32% 0.02 70);
}
.ax-footer-brand span{ font-family:var(--ax-font-heading); font-weight:700; font-size:20px; color:#fff; }
.ax-footer-brand p{ font-size:13px; color:oklch(70% 0.01 70); margin:12px 0 0; max-width:34ch; line-height:1.6; }
.ax-footer h5{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:oklch(60% 0.01 70); margin:0 0 14px; }
.ax-footer-links{ display:flex; flex-direction:column; gap:9px; font-size:13.5px; }
.ax-footer-bottom{
	max-width:1180px; margin:0 auto; padding:18px 0; font-size:12px; color:var(--ax-footer-muted);
	display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
.ax-footer-bottom .legal{ display:flex; gap:18px; }

/* ===========================================================
   Responsive
   =========================================================== */
@media (max-width:900px){
	.ax-hero{ grid-template-columns:1fr; }
	.ax-featured-grid{ grid-template-columns:1fr; }
	.ax-cat-grid{ grid-template-columns:1fr 1fr; }
	.ax-archive-grid{ grid-template-columns:1fr 1fr; }
	.ax-popular-grid{ grid-template-columns:1fr; }
	.ax-split{ grid-template-columns:1fr; }
	.ax-footer-top{ grid-template-columns:1fr; }
}
@media (max-width:640px){
	.ax-header{ flex-wrap:wrap; gap:14px; padding:16px 20px; }
	.ax-nav{ order:3; width:100%; gap:16px; }
	.ax-hero, .ax-section, .ax-split{ padding-left:20px; padding-right:20px; }
	.ax-cat-grid, .ax-archive-grid{ grid-template-columns:1fr; }
	.ax-hero h1{ font-size:32px; }
}