.ik-collection-popup[hidden] { display: none !important; }
body.ik-collection-popup-open { overflow: hidden; }
.ik-collection-popup { position: fixed; z-index: 10050; inset: 0; display: grid; place-items: center; padding: 24px; background: #163f38a8; backdrop-filter: blur(10px); }
.ik-collection-popup__card { position: relative; box-sizing: border-box; display: grid; width: min(900px, 100%); grid-template-columns: minmax(220px, 250px) minmax(0, 1fr); gap: 32px; align-items: center; padding: 34px; overflow: hidden; border: 3px solid #e4d1a7; border-radius: 34px; background: linear-gradient(135deg, #fffdf6 0 58%, #e2f3e8 58%); box-shadow: 0 18px 0 #294f4533, 0 30px 65px #102d2855; }
.ik-collection-popup__close { position: absolute; z-index: 2; width: 48px; height: 48px; right: 18px; top: 18px; border: 2px solid #d8ccb3; border-radius: 50%; background: #fff; color: #244f46; font: 800 28px/1 sans-serif; cursor: pointer; }
.ik-collection-popup__shine { position: absolute; right: 74px; top: 13px; color: #f1b83f; font-size: 48px; transform: rotate(12deg); }
.ik-collection-popup__picture { display: grid; width: 250px; height: 250px; place-items: center; border: 3px solid #fff; border-radius: 50%; background: radial-gradient(circle, #fff 0 42%, #fff2c8 43% 62%, #f3c44e 63% 65%, #fff 66%); box-shadow: 0 12px 25px #284f4630; }
.ik-collection-popup__picture img { width: 82%; height: 82%; object-fit: contain; filter: drop-shadow(0 10px 10px #173e3630); }
.ik-collection-popup__copy { min-width: 0; }
.ik-collection-popup__copy > span { color: #b86732; font: 900 13px/1.2 Georgia, serif; letter-spacing: 2px; }
.ik-collection-popup__copy h2 { max-width: 100%; margin: 10px 0; overflow-wrap: anywhere; color: #234f46; font: 800 clamp(32px, 4vw, 48px)/.98 Georgia, serif; }
.ik-collection-popup__copy p { margin: 0; color: #5d706a; font: 700 15px/1.55 sans-serif; }
.ik-collection-popup__copy div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
.ik-collection-popup__copy a,.ik-collection-popup__copy button { display: grid; min-width: 0; min-height: 48px; place-items: center; padding: 13px 16px; border: 2px solid #2d7d69; border-radius: 15px; font: 800 14px/1.2 sans-serif; text-align: center; text-decoration: none; cursor: pointer; }
.ik-collection-popup__copy a { background: #2f9b7e; color: #fff; box-shadow: 0 5px 0 #21745f; }
.ik-collection-popup__copy button { background: #fffdf7; color: #28594e; }

.collection-hero { display: grid; grid-template-columns: 1fr 310px; gap: 34px; align-items: center; margin-top: 18px; padding: 48px; border: 2px solid #deceb0; border-radius: 34px; background: linear-gradient(120deg, #fffaf0 0 62%, #dff1e5 62%); box-shadow: 0 11px 0 #e3d5bb, 0 20px 35px #60471618; }
.collection-hero h1 { max-width: 720px; margin: 8px 0 14px; color: #214d43; font-size: clamp(44px, 6vw, 72px); line-height: .94; letter-spacing: -2px; }
.collection-hero p { max-width: 720px; margin: 0; color: #61716b; font-size: 16px; font-weight: 700; line-height: 1.65; }
.collection-progress-card { padding: 28px; border: 2px solid #fff; border-radius: 26px; background: #ffffffd9; box-shadow: 0 10px 25px #294d4420; text-align: center; }
.collection-progress-card strong { display: block; color: #2e8e72; font: 800 58px/1 Georgia, serif; }
.collection-progress-card > span { display: block; margin-top: 6px; color: #526963; font-weight: 900; }
.collection-progress-card strong span { display: inline; }
.collection-progress-card i { display: block; height: 13px; margin-top: 20px; overflow: hidden; border-radius: 999px; background: #dfe9db; }
.collection-progress-card i::after { display: block; width: var(--collection-progress, 0%); height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ef7967, #f5bd43, #43aa82); content: ''; transition: width .35s ease; }
.collection-intro { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 30px; }
.collection-intro article { padding: 23px; border: 2px solid #e0d1b6; border-radius: 22px; background: #fffdf7; box-shadow: 0 7px 0 #e7dac2; }
.collection-intro b { color: #244f46; font-size: 18px; }
.collection-intro p { margin: 8px 0 0; color: #61716b; font-size: 13px; font-weight: 700; line-height: 1.55; }
.collection-group { margin-top: 54px; }
.collection-group__heading { display: flex; gap: 24px; align-items: end; justify-content: space-between; margin-bottom: 18px; }
.collection-group__heading h2 { margin: 5px 0 0; color: #244f46; font-size: clamp(30px, 4vw, 45px); }
.collection-group__heading p { max-width: 470px; margin: 0; color: #65736d; font-size: 13px; font-weight: 700; line-height: 1.5; }
.collection-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; }
.collection-item { position: relative; display: grid; min-height: 330px; grid-template-rows: 158px auto; overflow: hidden; border: 2px solid #dfceb0; border-radius: 22px; background: #fffaf0; box-shadow: 0 7px 0 #e1d3b8, 0 13px 22px #5c461514; transition: transform .18s ease, box-shadow .18s ease; }
.collection-item:hover { transform: translateY(-3px); box-shadow: 0 10px 0 #e1d3b8, 0 18px 26px #5c46151d; }
.collection-item__picture { position: relative; display: grid; place-items: center; padding: 14px; background: radial-gradient(circle at 50% 48%, #fff 0 28%, #ecf5ea 29% 61%, #dcece0 62%); }
.collection-item__picture img { width: 92%; height: 92%; object-fit: contain; transition: filter .25s ease, opacity .25s ease, transform .25s ease; }
.collection-item.is-locked .collection-item__picture img { opacity: .55; filter: grayscale(1) brightness(.08); transform: scale(.88); }
.collection-item__lock { position: absolute; display: grid; width: 44px; height: 44px; place-items: center; border: 3px solid #fff; border-radius: 50%; background: #f5bd43; color: #31534c; font-size: 19px; box-shadow: 0 5px 0 #ca9639; }
.collection-item.is-unlocked .collection-item__lock { display: none; }
.collection-item__body { padding: 15px 14px 17px; }
.collection-item__body > span { display: inline-flex; padding: 5px 8px; border-radius: 999px; background: #e4f2df; color: #2b735e; font-size: 9px; font-weight: 900; }
.collection-item.is-locked .collection-item__body > span { background: #fff0c4; color: #8e641c; }
.collection-item h3 { margin: 9px 0 6px; color: #234f46; font: 800 20px/1.05 Georgia, serif; }
.collection-item p { margin: 0; color: #65736d; font-size: 10px; font-weight: 700; line-height: 1.45; }
.collection-item a { display: inline-flex; margin-top: 10px; color: #2b8069; font-size: 10px; font-weight: 900; }
.collection-item__date { display: block; margin-top: 7px; color: #738079; font-size: 9px; font-weight: 800; }
.collection-guide,.rights-review { margin-top: 55px; padding: 38px; border: 2px solid #dfceb0; border-radius: 30px; background: #fff9ed; box-shadow: 0 9px 0 #e6d8bd; }
.collection-guide__heading { display: grid; grid-template-columns: 1fr 1fr; column-gap: 34px; align-items: end; }
.collection-guide__heading > span { grid-column: 1; }
.collection-guide__heading h2 { grid-column: 1; margin: 7px 0 0; color: #244f46; font-size: 34px; line-height: 1.05; }
.collection-guide__heading p { grid-column: 2; grid-row: 1 / span 2; margin: 0; color: #62716c; font-size: 13px; font-weight: 700; line-height: 1.6; }
.collection-guide__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; margin-top: 28px; }
.collection-guide__grid article { padding: 23px; border: 1px solid #decfb4; border-radius: 20px; background: #fff; }
.collection-guide__grid h3 { margin: 0 0 9px; color: #2c6757; font-size: 19px; }
.collection-guide__grid p { margin: 0; color: #64736e; font-size: 12px; font-weight: 700; line-height: 1.62; }
.collection-faq { margin-top: 38px; padding: 34px; border: 2px solid #bedbc8; border-radius: 28px; background: #eaf5ec; }
.collection-faq h2 { margin: 7px 0 19px; color: #244f46; font-size: 31px; }
.collection-faq details { border-top: 1px solid #c6dbcc; }
.collection-faq details:last-child { border-bottom: 1px solid #c6dbcc; }
.collection-faq summary { padding: 16px 4px; color: #295c50; font-size: 15px; font-weight: 900; cursor: pointer; }
.collection-faq p { margin: -3px 4px 17px; color: #61716b; font-size: 13px; font-weight: 700; line-height: 1.62; }
.collection-note { display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; margin-top: 55px; margin-bottom: 30px; padding: 33px; border: 2px solid #bedbc8; border-radius: 28px; background: #eaf5ec; }
.collection-note h2 { margin: 6px 0 9px; color: #244f46; font-size: 31px; }
.collection-note p { max-width: 760px; margin: 0; color: #60736c; font-size: 13px; font-weight: 700; line-height: 1.6; }
.collection-note a { padding: 15px 20px; border: 2px solid #ddcba9; border-radius: 16px; background: #fffdf7; color: #315a50; font-weight: 900; text-decoration: none; box-shadow: 0 5px 0 #dbc9a8; }
.rights-principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 30px; }
.rights-principles article { position: relative; min-height: 270px; padding: 27px; overflow: hidden; border: 2px solid #ddceb3; border-radius: 24px; background: #fffdf7; box-shadow: 0 8px 0 #e5d7bd; }
.rights-principles article > span { position: absolute; right: 20px; top: 10px; color: #ead8b5; font: 900 54px/1 Georgia, serif; }
.rights-principles h2 { position: relative; max-width: 230px; margin: 0 0 12px; color: #244f46; font-size: 22px; }
.rights-principles p { position: relative; margin: 0; color: #61716b; font-size: 13px; font-weight: 700; line-height: 1.6; }
.rights-request { display: grid; grid-template-columns: 330px 1fr; gap: 42px; margin-top: 48px; padding: 38px; border: 2px solid #bdd9c6; border-radius: 30px; background: #eaf5ec; }
.rights-request h2 { margin: 8px 0 12px; color: #234f46; font-size: 34px; line-height: 1.05; }
.rights-request > div p { margin: 0; color: #60736c; font-size: 13px; font-weight: 700; line-height: 1.6; }
.rights-request ol { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; counter-reset: rights; }
.rights-request li { display: grid; grid-template-columns: 150px 1fr; gap: 14px; padding: 14px 16px; border: 1px solid #c8ddcf; border-radius: 15px; background: #ffffffb8; counter-increment: rights; }
.rights-request li b { color: #2a6d5a; font-size: 13px; }
.rights-request li span { color: #5f706a; font-size: 12px; font-weight: 700; line-height: 1.5; }
.rights-contact { display: grid; grid-template-columns: 1.1fr .9fr; gap: 18px; margin-top: 34px; padding: 34px; border: 2px solid #dfceb0; border-radius: 28px; background: #fff9ec; box-shadow: 0 8px 0 #e7d9bf; }
.rights-contact h2 { margin: 7px 0 13px; color: #244f46; font-size: 31px; }
.rights-contact strong { display: block; color: #a8662b; font-size: 18px; }
.rights-contact p { margin: 9px 0 0; color: #65736d; font-size: 13px; font-weight: 700; line-height: 1.6; }
.rights-contact__email { display: inline-flex; padding: 12px 16px; border-radius: 13px; background: #e4f1e6; color: #246953; font-size: 18px; font-weight: 900; }
.rights-contact aside { padding: 23px; border-radius: 20px; background: #fff; }
.rights-contact aside b { color: #244f46; font-size: 17px; }
.rights-links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 32px; margin-bottom: 35px; }
.rights-links a { display: grid; gap: 7px; padding: 24px; border: 2px solid #dfceb0; border-radius: 21px; background: #fffdf7; color: #244f46; text-decoration: none; box-shadow: 0 6px 0 #e6d8bd; }
.rights-links b { font-size: 18px; }
.rights-links span { color: #397d68; font-size: 12px; font-weight: 900; }

@media (max-width: 900px) {
  .collection-hero { grid-template-columns: 1fr; padding: 34px; background: linear-gradient(145deg, #fffaf0 0 68%, #dff1e5 68%); }
  .collection-progress-card { max-width: 340px; }
  .collection-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .collection-intro { grid-template-columns: 1fr; }
  .collection-guide__heading { grid-template-columns: 1fr; }
  .collection-guide__heading > span,.collection-guide__heading h2,.collection-guide__heading p { grid-column: 1; grid-row: auto; }
  .collection-guide__heading p { margin-top: 12px; }
  .rights-principles { grid-template-columns: 1fr; }
  .rights-principles article { min-height: 0; }
  .rights-request { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 800px) {
  .ik-collection-popup { padding: 16px; }
  .ik-collection-popup__card { grid-template-columns: 1fr; gap: 14px; max-height: calc(100dvh - 32px); padding: 24px; overflow-y: auto; text-align: center; }
  .ik-collection-popup__picture { width: 170px; height: 170px; margin: 0 auto; }
  .ik-collection-popup__copy h2 { font-size: clamp(30px, 7vw, 42px); }
  .ik-collection-popup__copy div { max-width: 540px; margin-right: auto; margin-left: auto; }
}
@media (max-width: 620px) {
  .ik-collection-popup { padding: 12px; }
  .ik-collection-popup__card { grid-template-columns: 1fr; gap: 14px; max-height: calc(100dvh - 24px); padding: 22px; overflow-y: auto; text-align: center; }
  .ik-collection-popup__picture { width: 180px; height: 180px; margin: 0 auto; }
  .ik-collection-popup__close { width: 42px; height: 42px; right: 12px; top: 12px; }
  .ik-collection-popup__shine { display: none; }
  .ik-collection-popup__copy div { grid-template-columns: 1fr; width: 100%; }
  .collection-hero { padding: 25px 20px; border-radius: 26px; }
  .collection-hero h1 { font-size: 42px; }
  .collection-hero p { font-size: 13px; }
  .collection-progress-card { width: 100%; padding: 22px; }
  .collection-group { margin-top: 38px; }
  .collection-group__heading { display: block; }
  .collection-group__heading p { margin-top: 8px; }
  .collection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .collection-item { min-height: 0; grid-template-rows: 128px auto; border-radius: 18px; }
  .collection-item__picture { padding: 10px; }
  .collection-item__body { padding: 12px 11px 14px; }
  .collection-item h3 { font-size: 18px; }
  .collection-note { grid-template-columns: 1fr; padding: 24px 20px; }
  .collection-note h2 { font-size: 27px; }
  .collection-note a { text-align: center; }
  .collection-guide,.rights-review,.collection-faq { padding: 24px 20px; }
  .collection-guide__grid { grid-template-columns: 1fr; }
  .rights-request,.rights-contact { grid-template-columns: 1fr; padding: 23px 20px; }
  .rights-request li { grid-template-columns: 1fr; gap: 5px; }
  .rights-links { grid-template-columns: 1fr; }
}
