/* =====================================================================
   Save the Event · styles du groupe « offre »
   Pages : /packs-tarifs/, /collections/, /realisations/, /contact/, /faq/
   Chargé après /assets/site.css. Ne redéfinit aucun composant commun :
   uniquement des blocs préfixés .of-
   ===================================================================== */

/* ---------- Héros : pile de trois packs (packs-tarifs) ---------- */
.of-stack{position:relative;aspect-ratio:4/4.3;display:grid;place-items:center}
.of-stack::before{content:"";position:absolute;inset:6% 4% 4%;border-radius:999px 999px var(--r-l) var(--r-l);background:
  radial-gradient(circle at 1px 1px,rgba(19,35,28,.14) 1px,transparent 1.5px) 0 0/18px 18px,var(--mint);transform:rotate(1.5deg)}
.of-tk{position:absolute;width:52%;aspect-ratio:3/4.1;border-radius:18px;background:var(--card);box-shadow:var(--shadow-lg);padding:6cqw 5cqw;display:grid;align-content:start;gap:2cqw;transition:transform .6s var(--spring)}
.of-tk .k{font-family:var(--f-mono);font-size:max(10px,2.4cqw);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.of-tk b{font-family:var(--f-display);font-weight:780;font-size:max(22px,7.4cqw);letter-spacing:-.04em;line-height:1}
.of-tk i{display:block;height:1.6cqw;border-radius:9px;background:var(--paper-2)}
.of-tk i:nth-of-type(2){width:80%}.of-tk i:nth-of-type(3){width:64%}
.of-tk.a{left:0;top:22%;width:46%;transform:rotate(-9deg)}
.of-tk.c{right:0;top:22%;width:46%;transform:rotate(8deg);justify-items:end;text-align:right}
.of-tk.c i{justify-self:end}
.of-tk.a b,.of-tk.c b{font-size:max(15px,5.6cqw);white-space:nowrap}
.of-tk.b{top:12%;left:50%;width:46%;translate:-50% 0;background:var(--ink);color:var(--paper);z-index:2;transform:rotate(-1deg)}
.of-tk.b .k{color:var(--sun)}
.of-tk.b i{background:rgba(247,246,242,.16)}
.phero-vis:hover .of-tk.a{transform:rotate(-13deg) translate(-4px,4px)}
.phero-vis:hover .of-tk.c{transform:rotate(12deg) translate(4px,4px)}
.phero-vis .of-stack ~ .phero-price{z-index:3}
.phero-vis .of-stack ~ .stamp{z-index:3}

/* ---------- Héros : éventail de trois faire-part (collections) ---------- */
.of-fan{position:relative;aspect-ratio:4/4.3}
.of-fan::before{content:"";position:absolute;inset:4% 2% 6%;border-radius:var(--r-l) var(--r-l) 999px 999px;background:
  repeating-linear-gradient(135deg,rgba(60,40,140,.06) 0 2px,transparent 2px 14px),var(--lilac);transform:rotate(-1.5deg)}
.of-inv{position:absolute;width:42%;aspect-ratio:5/7;background:var(--card);border-radius:4px;box-shadow:var(--shadow-lg);display:grid;align-content:center;justify-items:center;gap:3cqw;padding:5cqw 3cqw;text-align:center;transition:transform .6s var(--spring)}
.of-inv::before{content:"";position:absolute;inset:2.2cqw;border:1px solid color-mix(in srgb,var(--u) 35%,transparent);border-radius:2px;pointer-events:none}
.of-inv svg{width:86%;height:auto}
.of-inv .k{font-family:var(--f-mono);font-size:max(9px,1.9cqw);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.of-inv .n{font-size:max(17px,6.4cqw);line-height:1;color:var(--u)}
.of-inv .d{font-family:var(--f-mono);font-size:max(9px,1.9cqw);letter-spacing:.12em;color:var(--u)}
.of-inv.j{left:0;top:14%;transform:rotate(-10deg);justify-items:start;text-align:left;padding-left:5cqw}
.of-inv.r{right:0;top:12%;transform:rotate(9deg);justify-items:end;text-align:right;padding-right:5cqw}
.of-inv.j svg,.of-inv.r svg{width:62%}
.of-inv.g{left:50%;top:30%;width:38%;translate:-50% 0;z-index:2;transform:rotate(-1deg)}
.phero-vis:hover .of-inv.j{transform:rotate(-14deg) translate(-6px,2px)}
.phero-vis:hover .of-inv.r{transform:rotate(13deg) translate(6px,2px)}
.phero-vis .of-fan ~ .phero-price,.phero-vis .of-fan ~ .stamp{z-index:3}

/* Typographies des collections (réutilisables partout) */
.of-ff-j{font-family:var(--f-serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.of-ff-r{font-family:var(--f-display);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-variation-settings:"wdth" 78;font-size:.72em}
.of-ff-g{font-family:var(--f-display);font-weight:800;letter-spacing:-.05em;font-variation-settings:"wdth" 80}

/* ---------- Raccourcis de prix sous le héros ---------- */
.of-quick{margin-top:4px}
@media (max-width:979.98px){.phero .of-quick{order:7}}

/* ---------- Tableaux comparatifs ---------- */
.of-scroll{overflow-x:auto;border-radius:var(--r-l);background:var(--card);box-shadow:inset 0 0 0 1px var(--line);-webkit-overflow-scrolling:touch}
.of-scroll:focus-visible{outline-offset:4px}
.of-cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:.96rem;min-width:340px}
.of-cmp caption{caption-side:top;text-align:left}
.of-cmp th,.of-cmp td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle}
.of-cmp tbody:last-child tr:last-child > *{border-bottom:0}
.of-cmp th[scope="row"]{text-align:left;font-weight:550;line-height:1.3}
.of-cmp thead th{padding:22px 12px 18px;vertical-align:bottom;border-bottom:1.5px solid var(--ink)}
.of-cmp thead th:first-child{text-align:left}
.of-lv{display:block;font-family:var(--f-display);font-weight:750;font-size:1.25rem;letter-spacing:-.03em;line-height:1.05}
.of-pz{display:block;margin-top:6px;font-family:var(--f-mono);font-size:.78rem;font-weight:500;letter-spacing:.02em;color:var(--ink-2);white-space:nowrap}
.of-cmp .is-star{background:var(--ink);color:var(--paper);border-bottom-color:rgba(247,246,242,.14)}
.of-cmp thead .is-star{border-radius:20px 20px 0 0;position:relative}
.of-cmp tbody:last-child tr:last-child .is-star{border-radius:0 0 20px 20px}
.of-cmp .is-star .of-pz{color:var(--sun)}
.of-cmp .of-top{display:inline-block;margin-bottom:8px;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;background:var(--sun);color:var(--ink);padding:3px 8px;border-radius:99px}
.of-ck{width:24px;height:24px;color:var(--green-2);vertical-align:middle}
.of-cmp .is-star .of-ck{color:var(--sun)}
.of-no{display:inline-block;width:14px;height:2px;border-radius:2px;background:var(--line);vertical-align:middle}
.of-cmp .is-star .of-no{background:rgba(247,246,242,.3)}
.of-tx{font-size:.84rem;font-weight:600;line-height:1.25}
.of-grp th{padding:20px 12px 8px;text-align:left;font-family:var(--f-mono);font-size:.7rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--coral-ink);border-bottom:0}
.of-grp > *{border-bottom:0!important}
.of-cmp .of-act td{padding-top:18px;padding-bottom:22px}
.of-cmp .of-act .btn{min-height:44px;padding:0 14px;font-size:.9rem}
.of-cmp tbody th a{font-weight:650;text-decoration-color:var(--coral);text-decoration-thickness:2px;text-underline-offset:3px}
.of-mx td{font-family:var(--f-mono);font-size:.88rem;white-space:nowrap}
.of-mx td small{display:block;font-family:var(--f-body);font-size:.74rem;white-space:normal;color:var(--ink-2);line-height:1.25;margin-top:2px}
.of-mx td.is-star small{color:rgba(247,246,242,.78)}
.of-mx th[scope="row"] small{display:block;font-weight:400;font-size:.8rem;color:var(--ink-2);margin-top:2px}
@media (max-width:699.98px){
  .of-cmp{font-size:.86rem;table-layout:fixed;min-width:0}
  .of-cmp thead th:first-child{width:37%}
  .of-mx thead th:first-child{width:34%}
  .of-cmp th,.of-cmp td{padding:12px 6px}
  .of-cmp th[scope="row"]{padding-left:14px}
  .of-cmp thead th:first-child{padding-left:14px}
  .of-lv{font-size:.84rem;letter-spacing:-.02em}
  .of-pz{font-size:.68rem;white-space:normal}
  .of-cmp .of-top{font-size:.56rem;padding:2px 6px}
  .of-tx{font-size:.74rem}
  .of-mx td{font-size:.76rem;white-space:normal}
  .of-cmp .of-act .btn{padding:0 8px;font-size:.78rem;min-width:44px}
  .of-hide-s{display:none}
}
@media (min-width:1000px){.of-cmp th[scope="row"]{padding-left:28px}.of-cmp thead th:first-child,.of-grp th{padding-left:28px}}

/* ---------- Coordination (titres sémantiques h2/h3) ---------- */
.coord .intro h2{font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.04em}
.coord .lv h3{font-size:1.2rem;letter-spacing:-.02em}

/* ---------- Bloc deux colonnes : à la carte + aside ---------- */
.of-two{display:grid;gap:18px}
@media (min-width:1000px){.of-two{grid-template-columns:1fr 340px;align-items:start;gap:24px}}
.of-aside{border-radius:var(--r-l);padding:28px;display:grid;gap:14px;background:var(--sun-soft)}
.of-aside h3{font-size:1.5rem;letter-spacing:-.03em}
.of-aside p{color:var(--ink-2)}
.of-aside .big{font-family:var(--f-display);font-weight:780;font-size:3.4rem;letter-spacing:-.05em;line-height:.9;color:var(--coral-ink)}
.of-two .carte{grid-template-columns:1fr}
@media (min-width:860px) and (max-width:999.98px){.of-two .carte{grid-template-columns:1fr 1fr}}
.carte .of-incl{color:var(--green-2)}
.of-two .carte > div:last-child{border-bottom:0}

/* ---------- Présentation des collections ---------- */
.of-coll{display:grid;gap:clamp(24px,4vw,56px);align-items:center;padding-block:clamp(28px,4vw,48px);border-top:1.5px solid var(--ink)}
.of-coll:first-child{border-top:0;padding-top:0}
@media (min-width:960px){.of-coll{grid-template-columns:1.05fr 1fr}.of-coll.of-alt .of-viz{order:2}}
.of-viz{position:relative;border-radius:var(--r-l);overflow:hidden;aspect-ratio:480/300;box-shadow:inset 0 0 0 1px rgba(19,35,28,.08)}
.of-viz svg{display:block;width:100%;height:100%}
.of-viz .rv-serif,.real .viz .rv-serif{font-family:var(--f-serif);font-style:italic}
.of-viz .rv-mono{font-family:var(--f-mono);letter-spacing:.14em}
.of-viz .rv-riv{font-family:var(--f-display);font-weight:600;letter-spacing:.1em;font-variation-settings:"wdth" 78}
.of-viz .rv-disp{font-family:var(--f-display);font-weight:800;letter-spacing:-.04em}
.of-coll-b{display:grid;gap:16px;min-width:0}
.of-coll-b h3{font-size:clamp(2.2rem,4.6vw,3.6rem);letter-spacing:-.04em;line-height:.95}
.of-coll-b h3 .it{color:var(--coral)}
.of-coll-b > p{color:var(--ink-2);max-width:56ch}
.of-facts{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.of-facts li{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.04em;padding:7px 12px;border-radius:99px;background:var(--paper-2)}
.of-sw{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0;padding:0;list-style:none}
.of-sw li{display:inline-flex;align-items:center;gap:8px;font-size:.92rem;font-weight:550}
.of-sw i{width:26px;height:26px;border-radius:50%;flex:none;background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.of-ver{display:grid;gap:10px}
@media (min-width:560px){.of-ver{grid-template-columns:1fr 1fr}}
.of-ver > div{border-radius:var(--r-m);padding:18px 18px 20px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);display:grid;gap:8px;align-content:start}
.of-ver > div:nth-child(2){background:var(--ink);color:var(--paper);box-shadow:none}
.of-ver h4{font-size:1.1rem;letter-spacing:-.02em}
.of-ver .label{color:var(--coral-ink)}
.of-ver > div:nth-child(2) .label{color:var(--sun)}
.of-ver ul{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:.94rem}
.of-ver li{display:grid;grid-template-columns:18px 1fr;gap:8px;line-height:1.35}
.of-ver li svg{width:18px;height:18px;margin-top:1px;color:var(--green-2)}
.of-ver > div:nth-child(2) li svg{color:var(--sun)}

/* ---------- Réalisations : filtre et avertissement ---------- */
.of-notice{display:grid;gap:12px;align-items:start;border-radius:var(--r-l);padding:22px 24px;background:var(--coral-soft);margin-bottom:clamp(28px,4vw,44px)}
@media (min-width:760px){.of-notice{grid-template-columns:auto 1fr;gap:20px;align-items:center}}
.of-notice p{max-width:80ch}
.of-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;list-style:none}
.of-filter button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:0;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);font-weight:600;font-size:.95rem;cursor:pointer;transition:background-color .2s,color .2s,transform .3s var(--spring)}
.of-filter button:hover{transform:translateY(-2px) rotate(-1.5deg)}
.of-filter button b{font-family:var(--f-mono);font-weight:500;font-size:.8rem;color:var(--coral-ink)}
.of-filter button[aria-pressed="true"]{background:var(--ink);color:var(--paper);box-shadow:none}
.of-filter button[aria-pressed="true"] b{color:var(--sun)}
.of-count{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin:0 0 22px}
.of-reals{row-gap:clamp(28px,4vw,44px)}
@media (min-width:700px) and (max-width:999.98px){.of-reals{grid-template-columns:repeat(2,minmax(0,1fr))}}
.of-reals .real.is-in{animation:ofIn .5s var(--ease) backwards}
@keyframes ofIn{from{opacity:0;transform:translateY(10px)}}
.real .of-pk{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.real .of-pk .link-arrow{font-size:.95rem}

/* ---------- Contact ---------- */
.of-ways{display:grid;gap:14px}
@media (min-width:760px){.of-ways{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:760px) and (max-width:1099.98px){.of-ways .of-zone{grid-column:1/-1}}
@media (min-width:1100px){.of-ways{grid-template-columns:1fr 1.15fr;align-items:start}.of-ways .of-zone{grid-column:2;grid-row:1/span 2}}
.of-way{border-radius:var(--r-l);padding:26px;display:grid;gap:12px;align-content:start;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);min-width:0}
.of-way.t-mint{background:var(--mint);box-shadow:none}
.of-way h3{font-size:1.4rem;letter-spacing:-.03em}
.of-way p{color:var(--ink-2)}
.of-way .ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--mint);color:var(--green)}
.of-way.t-mint .ico{background:var(--card)}
.of-way .ico svg{width:26px;height:26px}
.of-way .mail{font-family:var(--f-display);font-weight:700;font-size:clamp(1.1rem,2.2vw,1.35rem);letter-spacing:-.02em;word-break:break-word;text-decoration-color:var(--coral);text-decoration-thickness:2px;text-underline-offset:4px}
.of-soc{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.of-soc a{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:0 16px;border-radius:14px;background:var(--paper-2);text-decoration:none;font-weight:600;transition:background-color .2s,transform .3s var(--spring)}
.of-soc a span{font-family:var(--f-mono);font-size:.8rem;font-weight:500;color:var(--ink-2);overflow-wrap:anywhere}
.of-soc a:hover{background:var(--sun-soft);transform:translateX(3px)}
.of-zone{display:grid;gap:18px;align-content:start}
.of-zone svg.map{width:100%;max-width:340px;height:auto;justify-self:center}
.of-zone .chips .chip{min-height:40px;font-size:.9rem;background:var(--paper-2);box-shadow:none}
.of-legal{margin-top:18px;font-size:.92rem;color:var(--ink-2)}

/* ---------- FAQ : sommaire par thème ---------- */
.of-toc{position:sticky;top:76px;z-index:5;padding-block:10px;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
@media (max-width:759.98px){.of-toc{position:static;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}}
.of-faq-band{scroll-margin-top:130px;padding-block:clamp(56px,7vw,104px)}
.of-faq-band .sec-head .label b{font-weight:500;color:var(--coral-ink)}

@media (prefers-reduced-motion:reduce){
  .of-tk,.of-inv,.of-filter button,.of-soc a{transition:none}
  .of-reals .real.is-in{animation:none}
}
.pk-anchors{height:0;overflow:hidden}.pk-anchors span{display:block;height:0}
.of-cmp tbody th a{display:inline-flex;align-items:center;min-height:44px}
.of-way .mail{display:inline-flex;align-items:center;min-height:44px}