/* =========================================================
   ZYTNA — Huile d'olive extra vierge
   Couleurs du logo uniquement : or #d1b35a, anthracite #2c2e35, blanc
   Typographies : Cinzel (comme « ZYTNA »), Jost (comme « EXTRA VIERGE »),
   Cormorant Garamond italique pour les accents
   ========================================================= */

:root{
	--gold:#d1b35a;
	--gold-deep:#a8893a;          /* or assombri, pour les petits textes sur blanc */
	--gold-soft:#f7f1df;          /* teinte très claire de l'or, fonds de section */
	--ink:#2c2e35;
	--ink-soft:#3a3d46;
	--white:#ffffff;
	--muted:rgba(44,46,53,.66);
	--line:rgba(44,46,53,.14);
	--line-w:rgba(255,255,255,.22);

	--display:'Cinzel', 'Times New Roman', serif;
	--sans:'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--italic:'Cormorant Garamond', Georgia, serif;

	--ease:cubic-bezier(.22,1,.36,1);
	--ease-io:cubic-bezier(.76,0,.24,1);
	--wrap:1320px;
	--gutter:clamp(18px, 4vw, 56px);
	--header-h:84px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:100px;}
body{
	margin:0;font-family:var(--sans);font-size:16px;line-height:1.75;font-weight:400;
	color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.is-locked{overflow:hidden;}
img,video{max-width:100%;display:block;}
img{height:auto;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--display);font-weight:500;line-height:1.08;margin:0;letter-spacing:.01em;color:var(--ink);}
p{margin:0 0 1em;}
::selection{background:var(--gold);color:var(--ink);}
:focus-visible{outline:1.5px solid var(--gold);outline-offset:4px;}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.skip{position:fixed;left:16px;top:-80px;z-index:700;background:var(--ink);color:var(--white);padding:12px 20px;border-radius:999px;text-decoration:none;font-size:13px;letter-spacing:.12em;text-transform:uppercase;transition:top .3s;}
.skip:focus{top:16px;}

/* Libellés et accents */
.eyebrow,.label{
	display:inline-flex;align-items:center;gap:14px;margin:0 0 22px;
	font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);
}
.eyebrow::before{content:'';width:28px;height:1px;background:var(--gold);}
.it,em{font-family:var(--italic);font-style:italic;font-weight:500;letter-spacing:0;text-transform:none;color:var(--gold-deep);}
h1 em,h2 em,h3 em{font-size:1.08em;}
.section--dark em,.hero em,.page-hero em,.cta em,.manifesto em,.hgal-pin em{color:var(--gold);}

.h-xl{font-size:clamp(2.6rem, 6.4vw, 6rem);text-transform:uppercase;line-height:.98;}
.h-lg{font-size:clamp(2rem, 4vw, 3.4rem);text-transform:uppercase;line-height:1.02;}
.h-md{font-size:clamp(1.5rem, 2.6vw, 2.2rem);text-transform:uppercase;}
.h-sm{font-size:clamp(1.05rem, 1.6vw, 1.25rem);text-transform:uppercase;letter-spacing:.06em;}
.lead{font-size:clamp(1.02rem, 1.25vw, 1.12rem);line-height:1.8;color:var(--muted);max-width:58ch;}

/* Sections */
.section{padding:clamp(90px, 12vw, 170px) 0;position:relative;}
.section--tight{padding:clamp(60px, 7vw, 100px) 0;}
.section--cream,.section--bone{background:var(--gold-soft);}
.section--dark{background:var(--ink);color:rgba(255,255,255,.78);}
.section--dark h2,.section--dark h3,.section--dark .h-lg{color:var(--white);}
.section--dark .eyebrow{color:rgba(255,255,255,.6);}
.section--dark .lead{color:rgba(255,255,255,.7);}
.head{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:860px;margin:0 auto clamp(46px, 6vw, 80px);}
.head > div{display:flex;flex-direction:column;align-items:center;}
.head .lead{margin:18px auto 0;}
.head .btn,.head .link{margin-top:26px;}

/* ---------- Boutons (pilule, contour, sans fond) ---------- */
.btn{
	position:relative;display:inline-flex;align-items:center;gap:14px;
	padding:15px 28px;border-radius:999px;border:1px solid currentColor;background:transparent;
	color:var(--ink);font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
	text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;
	transition:color .5s var(--ease), border-color .5s var(--ease);
}
.btn::after{
	content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--gold);
	transform:scaleX(0);transform-origin:100% 50%;transition:transform .6s var(--ease-io);opacity:.14;
}
.btn:hover{color:var(--gold-deep);border-color:var(--gold);}
.btn:hover::after{transform:scaleX(1);transform-origin:0 50%;}
.section--dark .btn,.hero .btn,.page-hero .btn,.cta .btn,.manifesto .btn,.footer .btn,.hgal-pin .btn{color:var(--white);}
.section--dark .btn:hover,.hero .btn:hover,.page-hero .btn:hover,.cta .btn:hover,.manifesto .btn:hover,.footer .btn:hover,.hgal-pin .btn:hover{color:var(--gold);}
.btn .arr{display:grid;place-items:center;transition:transform .5s var(--ease);}
.btn:hover .arr{transform:translateX(5px);}
.btn svg{width:15px;height:15px;}

.link{
	display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);
	font-size:11.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;
	padding-bottom:6px;background:linear-gradient(var(--gold),var(--gold)) 0 100% / 100% 1px no-repeat;
	transition:background-size .6s var(--ease), color .3s;
}
.link:hover{background-size:30% 1px;color:var(--gold-deep);}
.link svg{width:14px;height:14px;transition:transform .5s var(--ease);}
.link:hover svg{transform:translateX(4px);}
.section--dark .link{color:var(--white);}

/* ---------- Intro (chargement) ---------- */
.intro{
	position:fixed;inset:0;z-index:500;background:var(--white);display:grid;place-items:center;
	transition:clip-path 1.1s var(--ease-io);clip-path:inset(0 0 0 0);
}
.intro.is-out{clip-path:inset(0 0 100% 0);}
.intro.is-gone{display:none;}
.intro__logo{width:min(300px, 62vw);height:auto;overflow:visible;}
.intro__place{position:absolute;left:var(--gutter);bottom:46px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);}
.intro__count{position:absolute;right:var(--gutter);bottom:46px;font-size:12px;letter-spacing:.3em;color:var(--muted);font-variant-numeric:tabular-nums;}
.intro__bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:0 50%;}
html.no-intro .intro{display:none;}

/* Animation du logo : la meule se dessine puis se remplit, les lettres descendent en place */
.intro .lg-m{
	stroke:var(--gold);stroke-width:.35;fill-opacity:0;
	stroke-dasharray:1;stroke-dashoffset:1;
	animation:lg-draw 1.6s var(--ease) forwards, lg-fill .9s ease forwards;
	animation-delay:calc(var(--i) * 6ms), calc(1.2s + var(--i) * 4ms);
}
.intro .lg-w{opacity:0;animation:lg-fade .9s var(--ease) forwards;animation-delay:calc(1.6s + var(--i) * 110ms);}
.intro .lg-t{opacity:0;animation:lg-fade .8s ease forwards;animation-delay:calc(2.3s + var(--i) * 45ms);}
@keyframes lg-draw{to{stroke-dashoffset:0;}}
@keyframes lg-fill{to{fill-opacity:1;stroke-width:0;}}
@keyframes lg-fade{to{opacity:1;}}

/* ---------- Rideau de transition entre pages ---------- */
.pt{
	position:fixed;inset:0;z-index:450;background:var(--ink);display:grid;place-items:center;
	transform:translateY(100%);transition:transform .85s var(--ease-io);pointer-events:none;
}
.pt img{width:90px;opacity:.9;}
.pt.is-in{transform:translateY(0);}
.pt.is-leave{transform:translateY(-100%);}

/* ---------- En-tête ---------- */
.header{
	position:fixed;top:0;left:0;right:0;z-index:300;height:var(--header-h);
	display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;
	padding:0 var(--gutter);color:var(--white);
	border-bottom:1px solid var(--line-w);
	transition:background .5s var(--ease), color .5s var(--ease), border-color .5s, transform .6s var(--ease);
}
.header.is-solid{background:var(--white);color:var(--ink);border-color:var(--line);}
.header.is-hidden{transform:translateY(-100%);}
.header__left,.header__right{display:flex;align-items:center;gap:34px;}
.header__right{justify-content:flex-end;}
.header__link{
	position:relative;text-decoration:none;font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
	padding:6px 0;
}
.header__link::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:100% 50%;transition:transform .5s var(--ease);}
.header__link:hover::after,.header__link[aria-current="page"]::after{transform:scaleX(1);transform-origin:0 50%;}
.header__logo{display:block;width:74px;}
.header__logo img{width:100%;}
.header__logo .on-light{display:none;}
.header.is-solid .header__logo .on-dark{display:none;}
.header.is-solid .header__logo .on-light{display:block;}
.header__book{
	text-decoration:none;font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
	padding:12px 22px;border:1px solid currentColor;border-radius:999px;transition:color .4s, border-color .4s;
}
.header__book:hover{color:var(--gold);border-color:var(--gold);}
.burger{
	display:flex;align-items:center;gap:14px;background:none;border:0;padding:0;color:inherit;cursor:pointer;
	font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
}
.burger__lines{position:relative;width:28px;height:10px;}
.burger__lines span{position:absolute;left:0;height:1px;background:currentColor;transition:width .4s var(--ease);}
.burger__lines span:first-child{top:0;width:28px;}
.burger__lines span:last-child{bottom:0;width:18px;}
.burger:hover .burger__lines span:last-child{width:28px;}

/* ---------- Menu plein écran ---------- */
.menu{
	position:fixed;inset:0;z-index:400;background:var(--ink);color:var(--white);
	display:grid;grid-template-rows:auto 1fr auto;padding:0 var(--gutter);overflow-y:auto;
	clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .9s var(--ease-io), visibility 0s .9s;
}
.menu.is-open{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .9s var(--ease-io);}
.menu__top{display:flex;justify-content:space-between;align-items:center;height:var(--header-h);border-bottom:1px solid var(--line-w);}
.menu__top img{width:64px;}
.menu__close{background:none;border:0;color:var(--white);cursor:pointer;font-family:var(--sans);font-size:11px;letter-spacing:.26em;text-transform:uppercase;display:flex;align-items:center;gap:12px;}
.menu__close i{font-style:normal;font-size:22px;line-height:1;}
.menu__body{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center;padding:30px 0;}
.menu__list{list-style:none;margin:0;padding:0;}
.menu__list li{overflow:hidden;border-bottom:1px solid var(--line-w);}
.menu__list a{
	display:flex;align-items:baseline;gap:26px;padding:12px 0;text-decoration:none;
	font-family:var(--display);font-size:clamp(1.7rem, 4.2vw, 3.4rem);text-transform:uppercase;line-height:1.1;
	transform:translateY(110%);transition:transform .9s var(--ease), color .3s;
}
.menu__list a small{font-family:var(--sans);font-size:11px;letter-spacing:.2em;color:var(--gold);}
.menu__list a:hover,.menu__list a[aria-current="page"]{color:var(--gold);}
.menu.is-open .menu__list a{transform:none;transition-delay:calc(.3s + var(--i) * 60ms);}
.menu__visual{position:relative;aspect-ratio:4/5;max-height:62vh;overflow:hidden;justify-self:end;width:100%;max-width:440px;}
.menu__visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity .6s var(--ease), transform 1.2s var(--ease);}
.menu__visual img.is-active{opacity:1;transform:none;}
.menu__visual-cap{position:absolute;left:18px;bottom:16px;font-family:var(--italic);font-style:italic;font-size:1.3rem;color:var(--white);text-shadow:0 2px 12px rgba(0,0,0,.4);}
.menu__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 40px;padding:24px 0 30px;border-top:1px solid var(--line-w);font-size:13px;color:rgba(255,255,255,.7);}
.menu__foot a{text-decoration:none;color:var(--white);}
.menu__foot a:hover{color:var(--gold);}
.menu__foot small{display:block;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:4px;}

/* ---------- Hero vidéo ---------- */
.hero{position:relative;height:100svh;min-height:640px;color:var(--white);overflow:hidden;background:var(--ink);}
.hero__media{position:absolute;inset:0;}
.hero__media video{width:100%;height:100%;object-fit:cover;}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(44,46,53,.5) 0%, rgba(44,46,53,.1) 32%, rgba(44,46,53,.22) 58%, rgba(44,46,53,.85) 100%);}
.hero__topline{
	position:absolute;z-index:2;top:calc(var(--header-h) + 26px);left:var(--gutter);right:var(--gutter);
	display:flex;justify-content:space-between;gap:20px;font-size:11px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.86);
}
.hero__bottom{
	position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(40px, 7vh, 80px);
	display:grid;grid-template-columns:1fr 340px;gap:40px;align-items:end;
}
.hero__title{color:var(--white);font-size:clamp(2.4rem, 6.2vw, 6rem);line-height:1;text-transform:uppercase;letter-spacing:.01em;}
.hero__title .ln{display:block;}
.hero__title .ln:nth-child(2){padding-left:.6em;}
.hero__title .ln:nth-child(3){padding-left:1.2em;}
.hero__side .it{display:block;font-size:1.6rem;color:var(--white);margin-bottom:8px;}
.hero__side .label{color:rgba(255,255,255,.75);margin-bottom:14px;}
.hero__side p{font-size:15px;color:rgba(255,255,255,.86);line-height:1.65;}
.hero__side .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px;}
.hero__scroll{position:absolute;z-index:2;left:50%;bottom:0;width:1px;height:70px;background:rgba(255,255,255,.3);overflow:hidden;}
.hero__scroll::after{content:'';position:absolute;left:0;top:-50%;width:1px;height:50%;background:var(--gold);animation:scrolldown 2.2s var(--ease-io) infinite;}
@keyframes scrolldown{to{top:100%;}}

/* Bouton vidéo */
.play{
	display:inline-flex;align-items:center;gap:12px;padding:8px 22px 8px 8px;border-radius:999px;
	border:1px solid rgba(255,255,255,.6);background:transparent;color:var(--white);cursor:pointer;
	font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;transition:border-color .4s, color .4s;
}
.play__ico{position:relative;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--gold);color:var(--gold);}
.play__ico::before{content:'';position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--gold);animation:pulse 2.2s var(--ease) infinite;}
.play__ico svg{width:12px;height:12px;margin-left:2px;}
.play:hover{border-color:var(--gold);color:var(--gold);}
@keyframes pulse{0%{transform:scale(1);opacity:.8;}100%{transform:scale(1.7);opacity:0;}}

/* Fenêtre vidéo */
.video-modal{width:min(1100px, calc(100% - 32px));max-width:none;padding:0;border:0;background:#000;overflow:visible;}
.video-modal::backdrop{background:rgba(44,46,53,.94);}
.video-modal[open]{animation:modal-in .5s var(--ease);}
.video-modal video{width:100%;height:auto;aspect-ratio:3/2;max-height:82vh;object-fit:contain;background:#000;}
.video-modal__close{position:absolute;right:0;top:-58px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:transparent;color:var(--white);font-size:24px;line-height:1;cursor:pointer;transition:color .3s, border-color .3s;}
.video-modal__close:hover{color:var(--gold);border-color:var(--gold);}
@keyframes modal-in{from{opacity:0;transform:translateY(24px) scale(.97);}}

/* ---------- Déclaration ---------- */
.statement{text-align:center;}
.statement__mark{width:90px;margin:0 auto 34px;}
.statement__title{font-family:var(--italic);font-style:italic;font-weight:400;text-transform:none;font-size:clamp(2rem, 4.2vw, 3.6rem);line-height:1.14;max-width:22ch;margin:0 auto 28px;color:var(--ink);}
.statement__title em{font-size:1em;}
.statement p{max-width:54ch;margin:0 auto;color:var(--muted);}

/* Trio verger / moulin / table */
.trio{display:grid;grid-template-columns:repeat(3, 1fr);gap:clamp(18px, 2.4vw, 36px);margin-top:clamp(60px, 8vw, 110px);}
.trio__item{text-decoration:none;display:block;}
.trio__label{display:block;text-align:center;font-size:11px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;}
.trio__img{position:relative;aspect-ratio:3/4;overflow:hidden;margin-bottom:22px;}
.trio__img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transform:scale(1.04);transition:filter .9s var(--ease), transform 1.2s var(--ease);}
.trio__item:hover .trio__img img{filter:none;transform:scale(1.1);}
.trio__num{position:absolute;top:14px;left:14px;font-size:11px;letter-spacing:.2em;color:var(--white);}
.trio h3{font-family:var(--italic);font-style:italic;font-weight:500;text-transform:none;font-size:1.6rem;margin-bottom:8px;}
.trio p{font-size:14.5px;color:var(--muted);}

/* ---------- Manifeste plein écran ---------- */
.manifesto{position:relative;min-height:110vh;display:grid;place-items:center;text-align:center;color:var(--white);overflow:hidden;background:var(--ink);}
.manifesto__bg{position:absolute;inset:-12% 0;}
.manifesto__bg img{width:100%;height:100%;object-fit:cover;}
.manifesto::after{content:'';position:absolute;inset:0;background:rgba(44,46,53,.6);}
.manifesto .wrap{position:relative;z-index:2;}
.manifesto__mark{width:80px;margin:0 auto 34px;}
.manifesto h2{color:var(--white);font-size:clamp(2.2rem, 5.6vw, 5rem);line-height:1.02;text-transform:uppercase;max-width:16ch;margin:0 auto;}
.manifesto h2 em{display:block;}
.manifesto p{margin:28px auto 0;max-width:46ch;color:rgba(255,255,255,.84);}

/* ---------- Galerie horizontale épinglée ---------- */
.hgal-pin{position:relative;background:var(--ink);color:var(--white);}
.hgal-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding-top:var(--header-h);}
.hgal-head{padding:0 var(--gutter);margin-bottom:36px;display:flex;justify-content:space-between;align-items:end;gap:30px;}
.hgal-head h2{color:var(--white);}
.hgal-head .eyebrow{color:rgba(255,255,255,.6);}
.hgal-head p{max-width:40ch;color:rgba(255,255,255,.7);margin:0;}
.hgal{display:flex;gap:28px;padding:0 var(--gutter);width:max-content;will-change:transform;}
.hcard{width:clamp(260px, 26vw, 380px);flex:none;}
.hcard figure{margin:0 0 18px;aspect-ratio:4/5;overflow:hidden;position:relative;}
.hcard img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);}
.hcard:hover img{transform:scale(1.06);}
.hcard .n{position:absolute;top:14px;left:14px;font-family:var(--display);font-size:1.1rem;color:var(--ink);background:var(--gold);width:42px;height:42px;border-radius:50%;display:grid;place-items:center;}
.hcard h3{color:var(--white);font-size:1.1rem;text-transform:uppercase;margin-bottom:8px;}
.hcard p{color:rgba(255,255,255,.68);font-size:14.5px;margin:0;}

/* ---------- Formats ---------- */
.formats{display:grid;grid-template-columns:repeat(3, 1fr);gap:clamp(18px, 2.4vw, 36px);}
.format{text-decoration:none;display:flex;flex-direction:column;}
.format figure{margin:0 0 20px;aspect-ratio:4/5;overflow:hidden;background:var(--gold-soft);position:relative;}
.format figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);}
.format:hover figure img{transform:scale(1.06);}
.format .vol{position:absolute;top:14px;right:14px;font-family:var(--display);font-size:1.2rem;color:var(--ink);background:var(--white);padding:6px 16px;border-radius:999px;}
.format h3{font-size:1.1rem;text-transform:uppercase;margin-bottom:8px;}
.format p{font-size:14.5px;color:var(--muted);flex:1;}

/* ---------- Chiffres / qualité ---------- */
.figures{display:grid;grid-template-columns:repeat(4, 1fr);border-top:1px solid var(--line);}
.figure{padding:34px 24px 0 0;border-right:1px solid var(--line);margin-right:24px;}
.figure:last-child{border-right:0;margin-right:0;}
.figure b{display:block;font-family:var(--display);font-weight:500;font-size:clamp(2.4rem, 4.6vw, 4rem);line-height:1;color:var(--ink);}
.figure b small{font-size:.45em;color:var(--gold-deep);margin-left:4px;}
.figure > span{display:block;margin-top:12px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);}
.seal-line{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:56px;text-align:center;font-size:14px;color:var(--muted);}
.seal-line strong{color:var(--ink);font-weight:500;}
.seal-line svg{width:22px;height:22px;color:var(--gold-deep);flex:none;}

/* ---------- Split texte + image ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px, 7vw, 110px);align-items:center;}
.split__img{position:relative;aspect-ratio:4/5;overflow:hidden;}
.split__img img{position:absolute;left:0;top:-8%;width:100%;height:116%;object-fit:cover;}
.split h2{margin-bottom:26px;}
.split .btn{margin-top:14px;}
.dates{list-style:none;padding:0;margin:26px 0;border-top:1px solid var(--line);}
.dates li{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:15px;color:var(--muted);}
.dates b{font-family:var(--display);font-weight:500;font-size:1.3rem;color:var(--ink);}

/* ---------- Liste du guide ---------- */
.guide-teaser{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px, 6vw, 90px);align-items:start;}
.guide-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.guide-list a{
	display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);
	text-decoration:none;font-family:var(--italic);font-style:italic;font-size:clamp(1.25rem, 2vw, 1.6rem);transition:color .3s, padding .5s var(--ease);
}
.guide-list a:hover{color:var(--gold-deep);padding-left:12px;}
.guide-list svg{width:18px;height:18px;flex:none;}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
	list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:24px 0;
	font-family:var(--italic);font-style:italic;font-weight:500;font-size:clamp(1.2rem, 1.9vw, 1.5rem);line-height:1.3;transition:color .3s;
}
.faq summary::before{content:'Question';font-family:var(--sans);font-style:normal;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--gold-deep);}
.faq summary::after{
	content:'';width:14px;height:14px;
	background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 100% no-repeat;
	transition:transform .5s var(--ease);
}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .answer{padding:0 0 26px;max-width:70ch;color:var(--muted);}
.faq .answer p:last-child{margin:0;}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px, 6vw, 100px);align-items:start;}

/* ---------- Bandeau final ---------- */
.cta{position:relative;overflow:hidden;color:var(--white);background:var(--ink);text-align:center;padding:clamp(110px, 14vw, 200px) 0;}
.cta__bg{position:absolute;inset:-15% 0;z-index:0;}
.cta__bg img{width:100%;height:100%;object-fit:cover;opacity:.4;}
.cta .wrap{position:relative;z-index:2;}
.cta .eyebrow{color:rgba(255,255,255,.66);}
.cta .h-xl{color:var(--white);max-width:16ch;margin:0 auto 40px;}
.cta .actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;}

/* ---------- En-tête des pages internes ---------- */
.page-hero{position:relative;min-height:86svh;display:flex;align-items:flex-end;color:var(--white);background:var(--ink);overflow:hidden;padding:calc(var(--header-h) + 60px) 0 clamp(50px, 7vw, 90px);}
.page-hero__media{position:absolute;inset:-10% 0 0;}
.page-hero__media img{width:100%;height:100%;object-fit:cover;}
.page-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg, rgba(44,46,53,.5), rgba(44,46,53,.15) 40%, rgba(44,46,53,.86));}
.page-hero .wrap{position:relative;z-index:2;}
.page-hero .eyebrow{color:rgba(255,255,255,.75);}
.page-hero h1{color:var(--white);font-size:clamp(2.6rem, 7vw, 6.6rem);text-transform:uppercase;line-height:.98;}
.page-hero .lead{color:rgba(255,255,255,.86);margin-top:22px;}
.crumbs{display:flex;gap:12px;list-style:none;margin:0 0 26px;padding:0;font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.7);}
.crumbs li + li::before{content:'—';margin-right:12px;color:var(--gold);}
.crumbs a{text-decoration:none;}
.crumbs a:hover{color:var(--gold);}

/* ---------- Composants des pages internes ---------- */
.split-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px, 7vw, 110px);align-items:center;}
.stack{position:relative;padding:0 0 16% 14%;}
.stack .a{overflow:hidden;aspect-ratio:4/5;}
.stack .b{position:absolute;left:0;bottom:0;width:50%;overflow:hidden;aspect-ratio:1/1;border:10px solid var(--white);}
.section--cream .stack .b{border-color:var(--gold-soft);}
.stack img{width:100%;height:100%;object-fit:cover;}
.stack .seal{
	position:absolute;right:-14px;top:26px;width:116px;height:116px;border-radius:50%;
	background:var(--white);color:var(--ink);display:grid;place-items:center;text-align:center;
	font-size:10px;letter-spacing:.22em;text-transform:uppercase;border:1px solid var(--gold);
	animation:float 6s ease-in-out infinite;
}
.stack .seal b{display:block;font-family:var(--display);font-weight:500;font-size:28px;letter-spacing:0;color:var(--gold-deep);}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}

.bento{display:grid;grid-template-columns:repeat(12, 1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.tile{grid-column:span 4;position:relative;background:var(--white);padding:36px 30px 34px;min-height:250px;display:flex;flex-direction:column;transition:background .5s var(--ease);}
.section--cream .tile{background:var(--gold-soft);}
.section--cream .tile:hover{background:var(--white);}
.tile .ico{color:var(--gold-deep);margin-bottom:auto;}
.tile .ico svg{width:32px;height:32px;stroke-width:1.2;}
.tile h3{font-size:1.1rem;text-transform:uppercase;margin:30px 0 10px;}
.tile p{color:var(--muted);font-size:15px;margin:0;}
.tile .num{position:absolute;top:30px;right:30px;font-size:11px;letter-spacing:.2em;color:var(--muted);}
.tile--wide{grid-column:span 8;}
.tile--full{grid-column:span 12;}
.tile--dark{background:var(--ink) !important;}
.tile--dark h3{color:var(--white);}
.tile--dark p,.tile--dark .num{color:rgba(255,255,255,.7);}
.tile--dark .ico{color:var(--gold);}

.steps{display:grid;grid-template-columns:repeat(3, 1fr);gap:1px;background:var(--line-w);border:1px solid var(--line-w);counter-reset:s;}
.step{background:var(--ink);padding:40px 32px;}
.step::before{counter-increment:s;content:'0' counter(s);display:block;font-family:var(--display);font-size:2.6rem;color:var(--gold);margin-bottom:34px;line-height:1;}
.step h3{color:var(--white);font-size:1.1rem;text-transform:uppercase;margin-bottom:10px;}
.step p{color:rgba(255,255,255,.7);font-size:15px;margin:0;}

.stats{display:grid;grid-template-columns:repeat(4, 1fr);border-top:1px solid var(--line-w);}
.stat{padding:34px 24px 0 0;border-right:1px solid var(--line-w);margin-right:24px;}
.stat:last-child{border-right:0;margin-right:0;}
.stat .n{font-family:var(--display);font-size:clamp(2.4rem, 4.6vw, 4rem);line-height:1;color:var(--white);}
.stat .n small{font-size:.45em;color:var(--gold);margin-left:3px;}
.stat .l{display:block;margin-top:12px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.62);}

.story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px, 7vw, 110px);align-items:center;}
.story__visual{position:relative;}
.story__img{position:relative;overflow:hidden;aspect-ratio:4/5;}
.story__img img{position:absolute;left:0;top:-10%;width:100%;height:120%;object-fit:cover;}
.story__year{position:absolute;right:-16px;bottom:30px;z-index:2;font-family:var(--display);font-size:clamp(1.4rem, 2.6vw, 2.2rem);color:var(--gold);background:var(--ink);padding:14px 24px;}
.story__text h2{margin-bottom:26px;}
.story__text .btn{margin-top:14px;}

.timeline{position:relative;max-width:980px;margin:0 auto;}
.timeline::before,.timeline__fill{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--line);}
.timeline__fill{background:var(--gold);bottom:auto;height:0;}
.tl{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:0 0 clamp(46px, 6vw, 80px);}
.tl::after{content:'';position:absolute;left:50%;top:14px;width:11px;height:11px;border-radius:50%;background:var(--white);border:1px solid var(--gold);transform:translateX(-50%);transition:background .5s;}
.section--cream .tl::after{background:var(--gold-soft);}
.tl.is-in::after{background:var(--gold) !important;}
.tl__year{font-family:var(--display);font-size:clamp(2.2rem, 4.4vw, 3.8rem);line-height:1;color:var(--gold-deep);text-align:right;}
.tl__card h3{font-family:var(--italic);font-style:italic;font-weight:500;text-transform:none;font-size:1.6rem;margin-bottom:8px;}
.tl__card p{color:var(--muted);margin:0;}
.tl:nth-child(even) .tl__year{order:2;text-align:left;}
.tl:nth-child(even) .tl__card{text-align:right;}

.showcase{display:flex;flex-direction:column;gap:clamp(70px, 10vw, 140px);}
.show{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px, 6vw, 100px);align-items:center;}
.show:nth-child(even) .show__media{order:2;}
.show__media{position:relative;overflow:hidden;aspect-ratio:4/5;background:var(--gold-soft);max-width:520px;width:100%;justify-self:center;}
.show__media img{width:100%;height:100%;object-fit:cover;}
.show__media .big{position:absolute;top:16px;left:16px;font-family:var(--display);font-size:1.2rem;background:var(--white);padding:6px 16px;border-radius:999px;}
.show__body h3{margin-bottom:18px;}
.show__body ul{list-style:none;padding:0;margin:26px 0 32px;border-top:1px solid var(--line);}
.show__body li{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14.5px;}
.show__body li span:first-child{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}
.show__body li span:last-child{text-align:right;}

.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;}
.chip{padding:16px 30px;border:1px solid var(--line-w);border-radius:999px;font-family:var(--italic);font-style:italic;font-size:1.4rem;color:var(--white);transition:border-color .4s, color .4s;}
.chip:hover{border-color:var(--gold);color:var(--gold);}

.compare-wrap{overflow-x:auto;}
.compare{width:100%;border-collapse:collapse;font-size:15px;}
.compare caption{caption-side:bottom;text-align:left;font-size:12px;color:var(--muted);padding-top:14px;}
.compare th,.compare td{text-align:left;padding:18px 20px;border-bottom:1px solid var(--line);vertical-align:top;}
.compare thead th{font-family:var(--italic);font-style:italic;font-weight:500;font-size:1.3rem;border-bottom:1px solid var(--ink);}
.compare tbody th{font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);width:24%;}

.uses{display:grid;grid-template-columns:repeat(4, 1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.use{background:var(--white);padding:34px 26px;text-align:center;transition:background .5s;}
.use:hover{background:var(--gold-soft);}
.use .ico{color:var(--gold-deep);display:grid;place-items:center;margin-bottom:20px;}
.use .ico svg{width:30px;height:30px;stroke-width:1.2;}
.use h3{font-family:var(--italic);font-style:italic;font-weight:500;text-transform:none;font-size:1.45rem;margin-bottom:8px;}
.use p{font-size:14.5px;color:var(--muted);margin:0;}

.guide{display:grid;grid-template-columns:260px 1fr;gap:clamp(40px, 6vw, 100px);align-items:start;}
.toc{position:sticky;top:120px;}
.toc p{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t;border-top:1px solid var(--line);}
.toc li{counter-increment:t;border-bottom:1px solid var(--line);}
.toc a{display:flex;gap:14px;padding:12px 0;text-decoration:none;font-size:14.5px;color:var(--muted);transition:color .3s;}
.toc a::before{content:counter(t, decimal-leading-zero);font-size:11px;letter-spacing:.1em;color:var(--gold-deep);padding-top:3px;}
.toc a:hover{color:var(--ink);}
.prose{max-width:72ch;}
.prose > section{padding-bottom:clamp(50px, 6vw, 80px);margin-bottom:clamp(50px, 6vw, 80px);border-bottom:1px solid var(--line);}
.prose > section:last-child{border-bottom:0;margin-bottom:0;}
.prose h2{font-size:clamp(1.6rem, 3vw, 2.3rem);text-transform:uppercase;margin-bottom:22px;}
.prose h3{font-family:var(--italic);font-style:italic;font-weight:500;text-transform:none;font-size:1.5rem;margin:30px 0 10px;}
.prose p,.prose li{color:#454852;}
.prose ul{padding-left:0;list-style:none;margin:0 0 1.2em;}
.prose ul li{position:relative;padding-left:26px;margin-bottom:10px;}
.prose ul li::before{content:'';position:absolute;left:0;top:.8em;width:12px;height:1px;background:var(--gold);}
.prose strong{color:var(--ink);font-weight:500;}
.note{border-left:1px solid var(--gold);background:var(--gold-soft);padding:22px 26px;margin:28px 0;}
.note p:last-child{margin:0;}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(36px, 6vw, 100px);align-items:start;}
.info{display:flex;flex-direction:column;margin-top:34px;border-top:1px solid var(--line);}
.info a,.info div{display:flex;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .5s var(--ease);}
.info a:hover{padding-left:10px;}
.info .ico{width:46px;height:46px;flex:none;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;color:var(--gold-deep);}
.info .ico svg{width:19px;height:19px;}
.info small{display:block;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);}
.info strong{font-weight:400;font-size:16px;}
.form{background:var(--white);padding:clamp(28px, 4vw, 52px);border:1px solid var(--line);}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;}
.field{position:relative;margin-bottom:22px;}
.field input,.field textarea{
	width:100%;padding:24px 0 10px;border:0;border-bottom:1px solid var(--line);background:transparent;
	font:inherit;font-size:16px;color:var(--ink);border-radius:0;outline:none;resize:vertical;
}
.field textarea{min-height:130px;}
.field label{position:absolute;left:0;top:22px;font-size:15px;color:var(--muted);pointer-events:none;transform-origin:0 0;transition:transform .4s var(--ease), color .4s;}
.field input:focus + label,.field input:not(:placeholder-shown) + label,
.field textarea:focus + label,.field textarea:not(:placeholder-shown) + label{transform:translateY(-20px) scale(.78);color:var(--gold-deep);}
.field::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease);}
.field:focus-within::after{transform:scaleX(1);}
.form__note{margin-top:18px;font-size:14px;color:var(--gold-deep);min-height:1.5em;}
.map{margin-top:clamp(50px, 7vw, 90px);border:1px solid var(--line);}
.map iframe{display:block;width:100%;height:460px;border:0;filter:grayscale(1) contrast(1.05);transition:filter .6s;}
.map:hover iframe{filter:none;}

/* ---------- Pied de page ---------- */
.footer{background:var(--ink);color:rgba(255,255,255,.7);padding:clamp(80px, 10vw, 130px) 0 0;}
.footer__cta{display:flex;justify-content:space-between;align-items:end;gap:40px;flex-wrap:wrap;padding-bottom:clamp(60px, 8vw, 100px);border-bottom:1px solid var(--line-w);}
.footer__cta h2{color:var(--white);font-size:clamp(2.2rem, 5vw, 4.4rem);text-transform:uppercase;line-height:1;max-width:15ch;}
.footer__top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:40px;padding:60px 0;}
.footer__brand img{width:150px;margin-bottom:20px;}
.footer__brand p{font-family:var(--italic);font-style:italic;font-size:1.3rem;color:var(--white);line-height:1.3;}
.footer h3{font-family:var(--sans);font-size:10.5px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:20px;}
.footer ul{list-style:none;margin:0;padding:0;}
.footer li{margin-bottom:10px;font-size:14.5px;}
.footer a{text-decoration:none;color:rgba(255,255,255,.78);transition:color .3s;}
.footer a:hover{color:var(--gold);}
.footer .contact li{display:flex;gap:12px;}
.footer .contact svg{width:16px;height:16px;flex:none;margin-top:5px;color:var(--gold);}
.socials{display:flex;gap:10px;margin-top:20px;}
.socials a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-w);transition:border-color .3s, color .3s;}
.socials a:hover{border-color:var(--gold);}
.socials svg{width:16px;height:16px;}
.footer__bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:24px 0;border-top:1px solid var(--line-w);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);}
.footer__bottom p{margin:0;}

/* ---------- Curseur ---------- */
.cursor{
	position:fixed;left:0;top:0;z-index:600;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;
	background:var(--gold);pointer-events:none;display:grid;place-items:center;
	transition:width .35s var(--ease), height .35s var(--ease), margin .35s var(--ease), background .35s;
}
.cursor span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);opacity:0;transition:opacity .3s;}
.cursor.is-hover{width:44px;height:44px;margin:-22px 0 0 -22px;background:rgba(209,179,90,.25);}
.cursor.is-view{width:84px;height:84px;margin:-42px 0 0 -42px;background:var(--gold);}
.cursor.is-view span{opacity:1;}

/* ---------- Titres découpés et apparitions ---------- */
[data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em;}
[data-split] .w > span{display:inline-block;transform:translateY(110%);transition:transform 1.1s var(--ease);transition-delay:calc(var(--i) * 55ms);}
body.is-ready [data-split].is-in .w > span{transform:none;}
[data-reveal]{opacity:0;transform:translateY(40px);transition:opacity 1.1s var(--ease), transform 1.1s var(--ease);transition-delay:var(--d, 0ms);}
body.is-ready [data-reveal].is-in{opacity:1;transform:none;}
[data-reveal="fade"]{transform:none;}
[data-reveal="img"]{opacity:1;transform:none;clip-path:inset(100% 0 0 0);transition:clip-path 1.4s var(--ease-io);}
body.is-ready [data-reveal="img"].is-in{clip-path:inset(0 0 0 0);}
html:not(.js) [data-reveal],html:not(.js) [data-split] .w > span{opacity:1;transform:none;clip-path:none;}

/* ---------- Page 404 ---------- */
.notfound{min-height:100svh;display:grid;place-items:center;text-align:center;padding:60px var(--gutter);background:var(--white);}
.notfound img{width:170px;margin:0 auto 30px;}
.notfound .h-xl{color:var(--gold);margin-bottom:10px;}
.notfound p{color:var(--muted);margin-bottom:30px;}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
	.hide-m{display:none !important;}
	.menu__body{grid-template-columns:1fr;}
	.menu__visual{display:none;}
	.footer__top{grid-template-columns:1fr 1fr;}
	.figures,.stats{grid-template-columns:repeat(2, 1fr);row-gap:30px;}
	.figure:nth-child(2),.stat:nth-child(2){border-right:0;margin-right:0;}
	.tile,.tile--wide{grid-column:span 6;}
	.uses{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width:820px){
	:root{--header-h:70px;}
	.header__book{display:none;}
	.header__logo{width:58px;}
	.hero__bottom{grid-template-columns:1fr;gap:26px;}
	.hero__topline span:last-child{display:none;}
	.trio,.formats,.steps{grid-template-columns:1fr;}
	.trio__img,.format figure{aspect-ratio:4/3;}
	.split,.split-2,.story,.show,.contact-grid,.faq-grid,.guide,.guide-teaser{grid-template-columns:1fr;}
	.show:nth-child(even) .show__media{order:0;}
	.tile,.tile--wide,.tile--full{grid-column:span 12;min-height:auto;}
	.timeline::before,.timeline__fill{left:6px;}
	.tl{grid-template-columns:1fr;gap:10px;padding-left:36px;}
	.tl::after{left:6px;}
	.tl__year,.tl:nth-child(even) .tl__year{order:0;text-align:left;}
	.tl:nth-child(even) .tl__card{text-align:left;}
	.toc{position:static;}
	.form .row{grid-template-columns:1fr;}
	.hgal-head{flex-direction:column;align-items:flex-start;}
	.faq summary{grid-template-columns:1fr auto;}
	.faq summary::before{display:none;}
	.story__year{right:10px;}
}
@media (max-width:560px){
	.footer__top,.figures,.stats,.uses{grid-template-columns:1fr;}
	.figure,.stat{border-right:0;margin-right:0;border-bottom:1px solid var(--line);padding-bottom:24px;}
	.stat{border-color:var(--line-w);}
	.stack .seal{right:0;width:96px;height:96px;}
}

@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;transition-delay:0ms !important;}
	html{scroll-behavior:auto;}
	[data-reveal],[data-split] .w > span{opacity:1 !important;transform:none !important;clip-path:none !important;}
}

/* Galerie horizontale sans épinglage (mobile / mouvement réduit) */
.hgal-pin.is-static .hgal-sticky{position:relative;height:auto;padding:clamp(80px, 10vw, 120px) 0;}
.hgal-pin.is-static .hgal{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;}
.hgal-pin.is-static .hcard{scroll-snap-align:start;width:min(78vw, 340px);}

/* =========================================================
   Identité propre à Zytna : arches marocaines, hero centré,
   badge tournant, intro « remplissage d'huile », en-tête inversé
   ========================================================= */

/* En-tête : logo à gauche, liens au centre, actions à droite */
.header{grid-template-columns:auto 1fr auto;gap:40px;}
.header__brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;}
.header__brand img{width:52px;}
.header__brand .on-light{display:none;}
.header.is-solid .header__brand .on-dark{display:none;}
.header.is-solid .header__brand .on-light{display:block;}
.header__brand span{display:flex;flex-direction:column;line-height:1;}
.header__brand b{font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:.14em;}
.header__brand small{font-size:9.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-top:6px;}
.header__nav{display:flex;justify-content:center;gap:38px;}
.header__right{gap:26px;}
.burger--right{flex-direction:row-reverse;}

/* Hero centré */
.hero__center{position:absolute;inset:0;z-index:2;display:grid;place-items:center;text-align:center;padding:calc(var(--header-h) + 30px) var(--gutter) 120px;}
.hero__center .eyebrow{color:rgba(255,255,255,.85);justify-content:center;}
.hero__center .eyebrow::after{content:'';width:28px;height:1px;background:var(--gold);}
.hero__big{color:var(--white);font-size:clamp(3rem, 9vw, 8.6rem);line-height:.92;text-transform:uppercase;letter-spacing:.04em;}
.hero__big em{display:block;font-size:.62em;color:var(--gold);letter-spacing:0;margin-top:.08em;}
.hero__center p{max-width:46ch;margin:26px auto 0;color:rgba(255,255,255,.88);font-size:1.02rem;}
.hero__center .actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:30px;}
.hero__info{position:absolute;z-index:2;left:var(--gutter);bottom:40px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.8);line-height:2;}
.hero__info b{display:block;font-weight:500;color:var(--gold);}

/* Badge tournant qui lance le film */
.badge{
	position:absolute;z-index:3;right:var(--gutter);bottom:34px;width:150px;height:150px;border-radius:50%;
	background:none;border:0;padding:0;cursor:pointer;color:var(--white);
}
.badge__ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 22s linear infinite;}
.badge__ring text{font-family:var(--sans);font-size:9.6px;letter-spacing:.32em;text-transform:uppercase;fill:currentColor;}
.badge__core{
	position:absolute;inset:34px;border-radius:50%;display:grid;place-items:center;
	border:1px solid rgba(255,255,255,.4);transition:background .5s var(--ease), border-color .5s;
}
.badge__core svg{width:18px;height:18px;margin-left:3px;color:var(--gold);transition:color .4s;}
.badge:hover .badge__core{background:var(--gold);border-color:var(--gold);}
.badge:hover .badge__core svg{color:var(--ink);}
.badge:hover .badge__ring{animation-duration:8s;}
@keyframes spin{to{transform:rotate(360deg);}}

/* Intro : l'huile monte */
.intro__fill{position:absolute;inset:0;background:var(--gold-soft);transform:scaleY(0);transform-origin:50% 100%;}
.intro__inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:28px;}
.intro__count{position:static;font-family:var(--display);font-size:15px;letter-spacing:.3em;color:var(--gold-deep);}
.intro__place{z-index:1;}
.intro__bar{display:none;}

/* Rideau de transition doré */
.pt{background:var(--gold);}

/* Arches marocaines */
.arch{border-radius:999px 999px 0 0;}
.trio__img,.format figure,.stack .a,.story__img,.split__img,.show__media,.values__img{border-radius:999px 999px 0 0;}
.trio__img img{filter:none;}
.trio__img{aspect-ratio:3/4.2;}
.trio__num{top:auto;bottom:14px;left:50%;transform:translateX(-50%);background:var(--white);color:var(--ink);padding:4px 12px;border-radius:999px;}
.trio__label{margin-bottom:20px;}
.trio__item{text-align:center;}
.trio h3,.trio p{text-align:center;}
.format .vol{top:auto;bottom:16px;right:50%;transform:translateX(50%);}
.show__media .big{top:auto;bottom:16px;left:50%;transform:translateX(-50%);}

/* Section des trois principes */
.values{background:var(--ink);color:rgba(255,255,255,.78);padding:clamp(90px, 12vw, 160px) 0;}
.values__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px, 7vw, 120px);align-items:start;}
.values__img{position:sticky;top:120px;aspect-ratio:3/4;overflow:hidden;}
.values__img img{width:100%;height:100%;object-fit:cover;}
.values__mark{width:64px;margin-bottom:28px;}
.values h2{color:var(--white);font-size:clamp(2rem, 4.2vw, 3.6rem);text-transform:uppercase;line-height:1.02;margin-bottom:50px;}
.values h2 em{display:block;color:var(--gold);}
.value{display:grid;grid-template-columns:90px 1fr;gap:24px;padding:34px 0;border-top:1px solid var(--line-w);}
.value:last-child{border-bottom:1px solid var(--line-w);}
.value b{font-family:var(--display);font-weight:400;font-size:3rem;line-height:1;color:transparent;-webkit-text-stroke:1px var(--gold);}
.value h3{font-family:var(--italic);font-style:italic;font-weight:500;text-transform:none;font-size:1.8rem;color:var(--white);margin-bottom:8px;}
.value p{margin:0;color:rgba(255,255,255,.72);}

/* Cartes de la galerie : grand numéro en contour */
.hcard figure{border-radius:0;}
.hcard .n{top:auto;bottom:12px;left:14px;width:auto;height:auto;background:none;border-radius:0;font-size:3.4rem;line-height:1;color:transparent;-webkit-text-stroke:1px var(--white);}

/* En-têtes des pages internes centrés */
.page-hero{align-items:center;text-align:center;}
.page-hero .crumbs,.page-hero .eyebrow{justify-content:center;}
.page-hero .eyebrow::after{content:'';width:28px;height:1px;background:var(--gold);}
.page-hero .lead{margin-left:auto;margin-right:auto;}

@media (max-width:1100px){
	.header{grid-template-columns:auto 1fr auto;}
	.header__nav{display:none;}
}
@media (max-width:820px){
	.header__brand small{display:none;}
	.header__brand img{width:42px;}
	.badge{width:116px;height:116px;bottom:24px;}
	.badge__core{inset:26px;}
	.badge__ring text{font-size:12px;}
	.hero__info{display:none;}
	.values__grid{grid-template-columns:1fr;}
	.values__img{position:relative;top:0;max-width:420px;}
	.value{grid-template-columns:60px 1fr;}
	.value b{font-size:2.2rem;}
}

.hero::after{background:radial-gradient(70% 60% at 50% 52%, rgba(44,46,53,.55), rgba(44,46,53,.15) 70%), linear-gradient(180deg, rgba(44,46,53,.5) 0%, rgba(44,46,53,.05) 30%, rgba(44,46,53,.1) 65%, rgba(44,46,53,.7) 100%);}

/* Apparition des photos : un rideau doré glisse (la photo n'est jamais masquée elle-même) */
[data-reveal="img"],body.is-ready [data-reveal="img"].is-in{clip-path:none;opacity:1;transform:none;}
[data-reveal="img"]::after{
	content:'';position:absolute;inset:0;z-index:3;background:var(--gold);
	transform-origin:50% 0;transition:transform 1.3s var(--ease-io);transition-delay:var(--d, 0ms);pointer-events:none;
}
body.is-ready [data-reveal="img"].is-in::after{transform:scaleY(0);}
html:not(.js) [data-reveal="img"]::after{display:none;}
@media (prefers-reduced-motion:reduce){[data-reveal="img"]::after{display:none;}}

/* Rideau de transition : la meule se dessine puis se remplit */
.pt__logo{width:120px;height:auto;overflow:visible;}
.pt .pt-m{fill-opacity:0;stroke:#fff;stroke-width:.4;stroke-dasharray:1;stroke-dashoffset:1;}
.pt.is-in .pt-m{
	animation:lg-draw .9s var(--ease) forwards, lg-fill .5s ease forwards;
	animation-delay:calc(.25s + var(--i) * 3ms), calc(.75s + var(--i) * 2ms);
}
.pt.is-in .pt__logo{animation:pt-float 1.6s ease-in-out .3s infinite alternate;}
.pt.is-leave .pt-m{animation:none;fill-opacity:1;stroke-width:0;stroke-dashoffset:0;}
.pt.is-leave .pt__logo{animation:none;transform:translateY(-30px) scale(.92);opacity:0;transition:transform .7s var(--ease-io), opacity .5s ease .1s;}
@keyframes pt-float{from{transform:translateY(0) rotate(-2deg);}to{transform:translateY(-8px) rotate(2deg);}}
.hgal-pin.is-static .hgal{scroll-padding-inline:var(--gutter);}
.hgal-pin.is-static .hgal-sticky{overflow:visible;}
.hgal-head p{max-width:min(40ch, 100%);}
@media (max-width:820px){.hgal-head > *{max-width:100%;}}

/* Mobile : la galerie du savoir-faire devient une grille verticale (pas de défilement latéral) */
@media (max-width:819px){
	.hgal-pin{height:auto !important;}
	.hgal-sticky{position:relative;height:auto;overflow:visible;padding:clamp(80px, 14vw, 110px) 0;}
	.hgal{display:grid !important;grid-template-columns:repeat(2, minmax(0, 1fr));gap:34px 16px;width:auto !important;overflow:visible !important;transform:none !important;padding:0 var(--gutter);}
	.hgal-pin .hcard{width:auto !important;min-width:0;}
	.hcard figure{aspect-ratio:4/5;margin-bottom:14px;}
	.hcard .n{font-size:2.4rem;}
	.hcard h3{font-size:1rem;}
	.hcard p{font-size:14px;}
}
@media (max-width:480px){
	.hgal{grid-template-columns:minmax(0, 1fr);}
	.hcard figure{aspect-ratio:4/3;}
}

/* Mobile et tablettes tactiles : aucune animation d'apparition ni parallaxe, tout est visible */
@media (max-width:819px), (hover:none){
	[data-reveal],[data-reveal].is-in,[data-split] .w > span{opacity:1 !important;transform:none !important;transition:none !important;clip-path:none !important;}
	[data-reveal="img"]::after{display:none !important;}
	[data-parallax],[data-parallax] img{transform:none !important;}
	.header.is-hidden{transform:none;}
}

/* Formats : logo Zytna sur fond crème (pas de photo d'étiquette) */
.format figure img.pack,.show__media img.pack{object-fit:contain;padding:18% 16% 26%;background:var(--gold-soft);}
.format:hover figure img.pack{transform:scale(1.04);}