/* Elvoria — identité éditoriale, chaleureuse et locale */
:root {
  color-scheme: light;
  --paper: #f4f0e7;
  --paper-dark: #e8e0d2;
  --white: #fffdf8;
  --ink: #182923;
  --muted: #65736a;
  --line: #d9d4c8;
  --green: #174737;
  --green-dark: #10372b;
  --green-light: #dfe9df;
  --orange: #c95637;
  --orange-light: #f0ded3;
  --gold: #e6bd6d;
  --display: Georgia, "Times New Roman", serif;
  --body: "Arial", "Helvetica Neue", sans-serif;
  --space: clamp(1.1rem, 4.8vw, 5rem);
  --max: 82rem;
  --radius: 1.35rem;
  --shadow: 0 24px 65px rgba(24, 41, 35, .12);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 6rem; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.6 var(--body); -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-underline-offset: .2em; }
a:hover { color: var(--orange); }
button, input, textarea, select { font: inherit; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; }
.wrap { width: min(var(--max), calc(100% - 2 * var(--space))); margin-inline: auto; }
.skip { position: absolute; z-index: 100; top: .5rem; left: .5rem; padding: .75rem 1rem; background: var(--green); color: white; transform: translateY(-150%); border-radius: .5rem; }
.skip:focus { transform: none; color: white; }
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(244,240,231,.94); backdrop-filter: blur(14px); transition: box-shadow .2s, border-color .2s; border-bottom: 1px solid transparent; }
.site-header.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 5px 25px rgba(24,41,35,.04); }
.nav { position:relative; min-height: 5.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; font: 700 1.08rem var(--display); text-decoration: none; letter-spacing: -.03em; white-space: nowrap; }
.brand img { width: 2.35rem; height: 2.35rem; }
.nav-links { display: flex; gap: clamp(1rem,2.5vw,2.2rem); align-items: center; color: var(--muted); font-size: .9rem; }
.nav-links a { text-decoration: none; }
.nav-links a:hover { color: var(--green); }
.nav-toggle { display:none; min-height:2.65rem; padding:.55rem .8rem; border:1px solid var(--line); border-radius:999px; background:var(--white); color:var(--ink); font:700 .84rem var(--body); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 3.25rem; border: 1px solid transparent; border-radius: 999px; padding: .76rem 1.35rem; font-weight: 700; text-decoration: none !important; cursor: pointer; transition: transform .18s, background .18s, color .18s; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--orange); color: white !important; box-shadow: 0 8px 22px rgba(201,86,55,.19); }
.btn-primary:hover { background: #a94026; }
.btn-secondary { background: transparent; color: var(--green) !important; border-color: #98a79a; }
.btn-secondary:hover { background: var(--green-light); }
.btn-ghost { background: var(--white); color: var(--ink) !important; border-color: var(--line); }

.hero { position: relative; display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: clamp(2rem,6vw,6rem); padding-block: clamp(4rem,8vw,8rem) clamp(4rem,7vw,6.5rem); }
.hero::before { content: ""; position: absolute; z-index: -1; width: 42vw; height: 42vw; max-width: 38rem; max-height: 38rem; right: -13vw; top: 2rem; border-radius: 50%; background: #e8e0d2; }
.hero-copy { max-width: 42rem; }
.eyebrow { display: flex; align-items: center; gap: .65rem; color: var(--orange); text-transform: uppercase; letter-spacing: .13em; font-size: .75rem; line-height: 1.3; font-weight: 800; margin: 0 0 1.5rem; }
.eyebrow::before { content: ""; width: 2rem; height: 1px; background: currentColor; }
.hero h1 { max-width: 11ch; font: 400 clamp(3.65rem,7.25vw,7rem)/.96 var(--display); letter-spacing: -.065em; margin: 0 0 1.5rem; }
.hero h1 em { color: var(--orange); font-weight: 400; }
.hero-lead { max-width: 34rem; color: #536259; font-size: clamp(1.05rem,1.5vw,1.22rem); margin: 0 0 1.7rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.hero-note { margin: 1.25rem 0 0; color: var(--muted); font-size: .82rem; }
.hero-panel { min-height: 33rem; position: relative; isolation: isolate; display: flex; align-items: end; padding: clamp(1.3rem,3vw,2.6rem); overflow: hidden; border-radius: 13rem 13rem var(--radius) var(--radius); background: var(--green); box-shadow: var(--shadow); color: #fffdf5; }
.hero-photo { position:absolute; z-index:-1; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-panel::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg,rgba(12,32,24,.02) 30%,rgba(11,37,27,.13) 52%,rgba(8,31,23,.85) 100%); }
.hero-card { position: relative; width: 100%; padding: 1.4rem 1.5rem 1.25rem; border: 1px solid rgba(255,255,255,.22); border-radius: 1rem; background: rgba(16,48,36,.73); backdrop-filter: blur(12px); }
.hero-card-top { display:flex; justify-content:space-between; gap:1rem; align-items:center; color:rgba(255,255,255,.75); font-size:.76rem; letter-spacing:.11em; text-transform:uppercase; }
.hero-card-top span:last-child { color:var(--gold); letter-spacing:0; text-transform:none; }
.price-row { display:flex; align-items:baseline; gap:.5rem; margin-top:.4rem; }
.price-row strong { font:400 clamp(3.3rem,5vw,4.7rem)/1 var(--display); letter-spacing:-.06em; }
.price-row small { color:rgba(255,255,255,.72); font-size:.93rem; }
.price-list { list-style:none; display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin:1rem 0 0; padding:1rem 0 0; border-top:1px solid rgba(255,255,255,.2); }
.price-list li { display:flex; align-items:center; gap:.4rem; color:rgba(255,255,255,.88); font-size:.82rem; }
.price-list li::before { content:"✓"; color:var(--gold); font-weight:700; }
.hero-index { position:absolute; top:2rem; right:2rem; color:rgba(255,255,255,.72); writing-mode:vertical-rl; font-size:.68rem; letter-spacing:.17em; text-transform:uppercase; }

section { padding-block: clamp(4rem,8vw,7.5rem); }
.section-head { display:grid; grid-template-columns:1fr .7fr; gap:2rem; align-items:end; margin-bottom:2.5rem; }
.section-head h2 { max-width:13ch; font:400 clamp(2.4rem,4.5vw,4.3rem)/1 var(--display); letter-spacing:-.055em; margin:0; }
.section-head p { max-width:31rem; color:var(--muted); margin:0 0 .3rem; font-size:1.02rem; }
#pourquoi { background:var(--white); }
.feature { border-top:1px solid var(--line); padding:1.3rem .4rem 0 0; }
.feature .num { color:var(--orange); font:italic 1.1rem var(--display); margin-bottom:1.8rem; }
.feature h3,.step h3 { font:400 1.55rem/1.2 var(--display); letter-spacing:-.03em; margin:0 0 .55rem; }
.feature p,.step p { color:var(--muted); margin:0; font-size:.94rem; max-width:26rem; }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(1rem,3vw,2.5rem); }
.band { position:relative; overflow:hidden; display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; padding:clamp(2rem,5vw,4.5rem); border-radius:var(--radius); background:var(--green); color:var(--white); }
.band::after { content:"20"; position:absolute; right:8rem; top:-7rem; color:rgba(255,255,255,.045); font:400 24rem/.9 var(--display); pointer-events:none; }
.band > * { position:relative; z-index:1; }
.band h2 { max-width:14ch; font:400 clamp(2.1rem,4vw,3.7rem)/1.04 var(--display); letter-spacing:-.045em; margin:0 0 .8rem; }
.band p { max-width:40rem; margin:0; color:rgba(255,253,248,.77); }
.band strong { color:var(--gold); }
.offer-includes { display:grid; gap:.75rem; max-width:43rem; list-style:none; padding:0; margin:1.6rem 0 1rem; }
.offer-includes li { display:grid; grid-template-columns:minmax(13rem,.75fr) 1fr; gap:1rem; align-items:baseline; padding:.7rem 0; border-top:1px solid rgba(255,255,255,.2); }
.offer-includes li strong { color:#fffdf8; }
.offer-includes li span,.offer-note { color:rgba(255,253,248,.74); font-size:.88rem; }
.offer-note { margin:.5rem 0 0; max-width:42rem; }
.offer-price { display:grid; justify-items:start; gap:.15rem; margin-bottom:1rem; }
.offer-price > span,.offer-price > small { color:rgba(255,253,248,.72); font-size:.83rem; }
.offer-price strong { color:var(--gold); font:400 clamp(2.7rem,5vw,4.6rem)/1 var(--display); letter-spacing:-.055em; }
.offer-price strong span { font:inherit; color:inherit; letter-spacing:inherit; }
.band .btn-primary { background:var(--gold); color:var(--green-dark)!important; box-shadow:none; }
.band .btn-primary:hover { background:#f2d28e; }
#deroule { background:var(--paper-dark); }
.steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; counter-reset:step; }
.step { min-height:13rem; padding:1.5rem; border:1px solid rgba(23,71,55,.16); border-radius:var(--radius); background:rgba(255,253,248,.55); counter-increment:step; }
.step::before { content:"0" counter(step); display:block; color:var(--orange); font:italic 1rem var(--display); margin-bottom:2.5rem; }
#region { background:var(--green-dark); color:var(--white); }
#region .section-head p { color:rgba(255,255,255,.68); }
#region .feature { border-color:rgba(255,255,255,.21); }
#region .feature p { color:rgba(255,255,255,.7); }
#region .feature h3 { color:#fffdf8; }
#region .feature .num { color:var(--gold); }
#apropos { background:var(--white); }
.about-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,6vw,5.5rem); align-items:start; }
.about-copy .eyebrow { margin-bottom:1.1rem; }
.about-copy h2 { max-width:14ch; font:400 clamp(2.4rem,4.5vw,4.1rem)/1.02 var(--display); letter-spacing:-.055em; margin:0 0 1.25rem; }
.about-lead { max-width:36rem; color:var(--ink); font-size:clamp(1.05rem,1.5vw,1.2rem); margin:0 0 1rem; }
.about-copy > p:last-child { max-width:36rem; color:var(--muted); margin:0; }
.about-points { display:grid; gap:0; }
.about-point { border-top:1px solid var(--line); padding:1.25rem 0 1.1rem; }
.about-point h3 { font:400 1.35rem/1.2 var(--display); letter-spacing:-.03em; margin:0 0 .45rem; }
.about-point p { color:var(--muted); margin:0; font-size:.94rem; max-width:28rem; }
#contact { background:var(--paper); }
.contact-grid { display:grid; grid-template-columns:.86fr 1.14fr; gap:clamp(2rem,6vw,6rem); align-items:start; }
.contact-grid .section-head { display:block; margin:0; }
.contact-grid .section-head h2 { max-width:10ch; margin-bottom:1rem; }
.contact-grid .section-head p { max-width:27rem; }
form.panel { background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(1.2rem,3vw,2rem); display:grid; gap:1rem; box-shadow:var(--shadow); }
label { display:grid; gap:.4rem; color:var(--ink); font-size:.84rem; font-weight:700; }
input,textarea,select { width:100%; min-height:3.1rem; padding:.8rem .9rem; border:1px solid #d6d5cd; border-radius:.65rem; background:#fffefa; color:var(--ink); }
input:focus,textarea:focus,select:focus { outline:0; border-color:var(--green); box-shadow:0 0 0 3px rgba(23,71,55,.12); }
textarea { min-height:8rem; resize:vertical; }
.row-2 { display:grid; grid-template-columns:1fr 1fr; gap:.85rem; }
.hp { position:absolute!important; left:-10000px!important; width:1px; height:1px; overflow:hidden; }
.form-error { min-height:1.2rem; color:#a33320; font-size:.87rem; font-weight:600; }
.aside { margin-top:2rem; padding:1.4rem 0 0; border-top:1px solid var(--line); }
.aside h3 { font:400 1.35rem var(--display); margin:0 0 .5rem; }
.aside p { margin:.2rem 0; color:var(--muted); font-size:.91rem; }
.aside #contact-email { margin-top:.75rem; color:var(--green); font-weight:700; }
.site-footer { padding:2rem 0 2.5rem; border-top:1px solid var(--line); color:var(--muted); font-size:.85rem; }
.footer-grid { display:flex; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; align-items:center; }
.footer-grid strong { color:var(--ink); font:700 1.15rem var(--display); }
.footer-links { display:flex; flex-wrap:wrap; gap:1.2rem; }
.footer-links a { text-decoration:none; }
.admin-link { opacity:.6; }
.legal { max-width:48rem; padding-block:4rem 6rem; }
.legal h1,.legal h2 { font-family:var(--display); letter-spacing:-.035em; }
.legal h1 { font-size:clamp(2.5rem,5vw,4rem); line-height:1; }
.legal h2 { margin-top:2.2rem; }
.legal p,.legal li { color:var(--muted); }
.toast { position:fixed; z-index:80; right:1.2rem; bottom:1.2rem; max-width:min(25rem,calc(100vw - 2.4rem)); padding:1rem 1.2rem; border-radius:.8rem; background:var(--green-dark); color:white; box-shadow:var(--shadow); opacity:0; transform:translateY(1rem); pointer-events:none; transition:.22s ease; }
.toast.show { opacity:1; transform:none; }
.toast.error { background:#a33320; }
.cookie { position:fixed; z-index:90; left:1.2rem; right:1.2rem; bottom:1.2rem; display:none; align-items:center; justify-content:space-between; gap:1.25rem; flex-wrap:wrap; padding:1rem 1.2rem; border:1px solid var(--line); border-radius:1rem; background:var(--white); box-shadow:var(--shadow); }
.cookie.show { display:flex; }
.cookie p { max-width:44rem; margin:0; color:var(--muted); font-size:.9rem; }
.cookie-actions { display:flex; gap:.5rem; flex-wrap:wrap; }
.reveal { opacity:0; transform:translateY(12px); transition:opacity .5s ease,transform .5s ease; }
.reveal.is-in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } .reveal { opacity:1; transform:none; } }
@media (max-width:900px) { .hero { grid-template-columns:1fr .85fr; gap:2rem; } .hero-panel { min-height:29rem; } .section-head { grid-template-columns:1fr; gap:1rem; } }
@media (max-width:700px) { .nav { min-height:4.6rem; gap:.6rem; } .nav-toggle { display:inline-flex; align-items:center; justify-content:center; } .nav-links { display:none; position:absolute; z-index:42; right:0; top:calc(100% - .15rem); width:min(17rem,calc(100vw - 2rem)); flex-direction:column; align-items:stretch; gap:0; padding:.5rem; border:1px solid var(--line); border-radius:.9rem; background:var(--white); box-shadow:var(--shadow); } .nav-links.is-open { display:flex; } .nav-links a { padding:.75rem; border-radius:.55rem; } .nav-links a:hover { background:var(--paper); } .nav .btn { min-height:2.8rem; padding:.62rem 1rem; font-size:.84rem; } .hero { grid-template-columns:1fr; padding-top:3.4rem; } .hero h1 { max-width:10ch; font-size:clamp(3.5rem,14vw,5.6rem); } .hero-panel { min-height:27rem; border-radius:10rem 10rem var(--radius) var(--radius); } .hero-index { top:1.5rem; right:1.2rem; } .grid-3,.steps,.contact-grid,.about-grid { grid-template-columns:1fr; } .grid-3 { gap:1.8rem; } .feature .num { margin-bottom:.9rem; } .band { grid-template-columns:1fr; } .band::after { right:-1rem; top:-3rem; font-size:16rem; } .offer-includes li { grid-template-columns:1fr; gap:.2rem; } .offer-price { margin-top:1.2rem; } .row-2 { grid-template-columns:1fr; } .contact-grid .section-head h2 { max-width:12ch; } .about-copy h2 { max-width:12ch; } .site-footer { padding-bottom:2rem; } }
@media (max-width:420px) { :root { --space:1rem; } .brand { font-size:.95rem; gap:.4rem; } .brand img { width:1.9rem;height:1.9rem; } .nav .btn { padding:.55rem .75rem; font-size:.77rem; } .hero-actions .btn { width:100%; } .price-list { display:grid; grid-template-columns:1fr 1fr; gap:.55rem; } }