/* ========= INFORMATION ============================
	- document:  WP Coder!
	- author:    Dmytro Lobov 
	- url:       https://wow-estore.com/
==================================================== */
:root{
  --orion-black:#151515;
  --orion-charcoal:#242424;
  --orion-grey:#f2f0ec;
  --orion-cream:#fbf7f1;
  --orion-stone:#6f6a60;
  --orion-terra:#a65f3f;
  --orion-terra-dark:#7d432d;
  --orion-gold:#c89b52;
  --orion-green:#394a3f;
  --orion-border:rgba(21,21,21,.12);
}
.orion-section{font-family:inherit;color:var(--orion-black);box-sizing:border-box;background:#fff;overflow:hidden}
.orion-section *{box-sizing:border-box}
.orion-wrap{max-width:1180px;margin:auto;padding:76px 22px}
.orion-eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--orion-terra);font-weight:800;margin-bottom:12px}
.orion-title{font-size:clamp(32px,5vw,60px);line-height:1.02;margin:0 0 18px;font-weight:800;letter-spacing:-.04em}
.orion-text{font-size:clamp(16px,2vw,20px);line-height:1.62;color:#444;margin:0}
.orion-small{font-size:15px;line-height:1.55;color:var(--orion-stone);margin:0}
.orion-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:999px;background:var(--orion-terra);color:#fff!important;text-decoration:none;font-weight:800}
.orion-btn.alt{background:#111;color:#fff!important}
.orion-card{background:#fff;border:1px solid var(--orion-border);border-radius:26px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.08)}
.orion-img{width:100%;height:100%;object-fit:cover;display:block}
.orion-grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center}
.orion-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.orion-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.orion-media-tall{height:560px}.orion-media-mid{height:360px}.orion-media-wide{height:520px}
.orion-cream{background:var(--orion-cream)}.orion-grey{background:var(--orion-grey)}
.orion-dark{background:#111;color:#fff}.orion-dark .orion-title{color:#fff}.orion-dark .orion-text,.orion-dark .orion-small{color:rgba(255,255,255,.78)}.orion-dark .orion-eyebrow{color:#d99a75}
.orion-list{display:grid;gap:10px;margin-top:22px}.orion-list div{padding:14px 16px;border-left:3px solid var(--orion-terra);background:var(--orion-cream);border-radius:14px;color:#222}
.orion-proof{border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:20px;line-height:1.45;color:rgba(255,255,255,.84)}.orion-proof b{font-size:24px;display:block;margin-bottom:8px;color:#fff}
.orion-badge{display:inline-block;border:1px solid rgba(166,95,63,.25);background:rgba(166,95,63,.08);color:var(--orion-terra-dark);padding:8px 12px;border-radius:999px;font-weight:800;font-size:13px}
.orion-overlay-card{position:absolute;left:22px;right:22px;bottom:22px;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border-radius:22px;padding:16px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.orion-overlay-card b{display:block;font-size:18px}.orion-overlay-card span{font-size:12px;color:var(--orion-stone)}
.orion-gallery-masonry{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:16px}.orion-gallery-masonry .orion-card:nth-child(2){height:520px}
.orion-cta-box{background:linear-gradient(135deg,var(--orion-green),var(--orion-black));color:#fff;border-radius:34px;padding:48px;display:grid;grid-template-columns:1fr .75fr;gap:28px;align-items:center}.orion-cta-box .orion-text{color:rgba(255,255,255,.8)}

/* ===== Mobile modernisé : plus immersif, moins effet “enchaînement de cadres” ===== */
@media(max-width:900px){
  .orion-section{position:relative}
  .orion-wrap{padding:46px 18px}
  .orion-grid-2{grid-template-columns:1fr;gap:22px}
  .orion-title{font-size:clamp(31px,9vw,42px);line-height:1.04;letter-spacing:-.045em;margin-bottom:14px}
  .orion-text{font-size:16.5px;line-height:1.58}
  .orion-eyebrow{font-size:11px;letter-spacing:.16em;margin-bottom:10px}
  .orion-btn{width:100%;padding:15px 18px}

  /* Hero : image d'abord, sensation découverte */
  .orion-hero .orion-wrap{padding-top:18px}
  .orion-hero .orion-card{order:-1}
  .orion-media-tall{height:68vh;min-height:470px;max-height:620px;border-radius:0 0 34px 34px}
  .orion-media-wide{height:430px}
  .orion-media-mid{height:330px}

  /* On sort du look carte partout : images plus éditoriales */
  .orion-card{border:0;box-shadow:none;border-radius:28px}
  .orion-cream,.orion-grey{background:#fff}
  .orion-cream .orion-wrap,.orion-grey .orion-wrap{background:linear-gradient(180deg,#fff 0%,var(--orion-cream) 100%)}

  /* Overlay hero en pastilles flottantes, plus premium */
  .orion-overlay-card{position:absolute;left:14px;right:14px;bottom:14px;display:flex;gap:8px;overflow-x:auto;padding:10px;background:rgba(18,18,18,.54);border:1px solid rgba(255,255,255,.14);border-radius:999px;backdrop-filter:blur(14px);scrollbar-width:none}
  .orion-overlay-card::-webkit-scrollbar{display:none}
  .orion-overlay-card div{min-width:116px;background:rgba(255,255,255,.92);border-radius:999px;padding:10px 12px}
  .orion-overlay-card b{font-size:13px;line-height:1}.orion-overlay-card span{font-size:10px;display:block;white-space:nowrap;margin-top:3px}

  /* Sections texte + image : effet magazine avec texte qui chevauche l'image */
  .orion-grid-2 > div:not(.orion-card){position:relative;z-index:2;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-radius:26px;padding:24px 20px;margin-top:-42px;border:1px solid rgba(21,21,21,.08)}
  .orion-dark .orion-grid-2 > div:not(.orion-card){background:rgba(17,17,17,.82);border-color:rgba(255,255,255,.12)}
  .orion-grid-2 > .orion-card + div,
  .orion-grid-2 > div:first-child:not(.orion-card){margin-top:0}
  .orion-grid-2 > div:first-child:not(.orion-card) + .orion-card{margin-top:4px}

  /* La méthode devient une timeline horizontale à swiper */
  .orion-grid-4{display:flex;gap:12px;overflow-x:auto;margin-left:-18px;margin-right:-18px;padding:0 18px 10px;scroll-snap-type:x mandatory;scrollbar-width:none}
  .orion-grid-4::-webkit-scrollbar{display:none}
  .orion-proof{min-width:76%;scroll-snap-align:start;border-radius:24px;padding:22px;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.16)}
  .orion-proof b{font-size:34px;color:#d99a75}

  /* Lifestyle : carrousel horizontal, pas trois gros cadres empilés */
  .orion-grid-3{display:flex;gap:14px;overflow-x:auto;margin-left:-18px;margin-right:-18px;padding:0 18px 12px;scroll-snap-type:x mandatory;scrollbar-width:none}
  .orion-grid-3::-webkit-scrollbar{display:none}
  .orion-grid-3 article{min-width:82%;scroll-snap-align:start;background:transparent;border-radius:30px;overflow:hidden}
  .orion-grid-3 article .orion-media-mid{height:390px;border-radius:30px;overflow:hidden}
  .orion-grid-3 article > div:last-child{margin: -76px 14px 0;position:relative;background:rgba(255,255,255,.92);border-radius:22px;padding:18px!important;backdrop-filter:blur(12px);border:1px solid rgba(21,21,21,.08)}

  /* Galerie : une grande image + miniatures horizontales */
  .orion-gallery-masonry{display:flex;gap:12px;overflow-x:auto;margin-left:-18px;margin-right:-18px;padding:0 18px 12px;scroll-snap-type:x mandatory;scrollbar-width:none}
  .orion-gallery-masonry::-webkit-scrollbar{display:none}
  .orion-gallery-masonry .orion-card{min-width:82%;height:420px!important;scroll-snap-align:start;border-radius:30px}
  .orion-gallery-masonry .orion-card:first-child{min-width:92%}

  /* CTA : plus léger, plus action */
  .orion-cta-box{grid-template-columns:1fr;padding:28px 20px;border-radius:30px;gap:18px;background:radial-gradient(circle at top left,rgba(166,95,63,.55),transparent 42%),linear-gradient(135deg,var(--orion-green),#111)}

  .orion-list div{border-left:0;border-top:3px solid var(--orion-terra);border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.05)}
}

@media(max-width:480px){
  .orion-wrap{padding-left:16px;padding-right:16px}
  .orion-media-tall{height:66vh;min-height:440px}
  .orion-media-wide{height:390px}
  .orion-grid-3 article{min-width:86%}
  .orion-grid-3 article .orion-media-mid{height:360px}
  .orion-gallery-masonry .orion-card{min-width:86%;height:390px!important}
}
