/* t59u/t60u – footer with newsletter in the free column space, share buttons, Premium upsell + package cards. Light/dark/mobile. */

/* ---------- footer: newsletter moves under the link columns (desktop) ---------- */
.t59-foot { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 24px; column-gap: 24px; align-items: start; }
.t59-foot > .footer-grid { display: contents; }
.t59-foot .footer-brand { grid-column: 1; grid-row: 1 / span 2; }
.t59-foot.has-nl .footer-grid > div:not(.footer-brand) { grid-row: 1; }
.t59-foot .nl-footer.t59-nl {
  grid-column: 2 / -1; grid-row: 2; align-self: end;
  grid-template-columns: 1fr; gap: 14px; margin: 4px 0 0; padding: 20px 22px;
  border-radius: 20px;
  background: linear-gradient(160deg, rgba(226, 177, 90, .14), rgba(255, 255, 255, .03) 60%); border-color: rgba(226, 177, 90, .28);
}
.t59-nl .nl-footer-copy { align-items: center; gap: 14px; }
.t59-nl .nl-footer-icon { width: 40px; height: 40px; border-radius: 12px; font-size: 1.05rem; background: rgba(226, 177, 90, .18); color: #f0c36d; }
.t59-nl h2 { font-size: 1.12rem; font-weight: 600; margin: 0 0 2px; }
.t59-nl .nl-footer-copy p { font-size: .9rem; line-height: 1.45; }
.t59-nl .nl-form { gap: 10px; }
.t59-nl .nl-consent { font-size: .84rem; line-height: 1.45; }
@media (min-width: 1100px) {
  .t59-foot .nl-footer.t59-nl { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); column-gap: 26px; align-items: center; }
}
@media (max-width: 860px) {
  .t59-foot { grid-template-columns: 1fr 1fr; gap: 22px 16px; }
  .t59-foot .footer-brand { grid-column: 1 / -1; grid-row: auto; }
  .t59-foot.has-nl .footer-grid > div:not(.footer-brand) { grid-row: auto; }
  .t59-foot .nl-footer.t59-nl { grid-column: 1 / -1; grid-row: auto; padding: 18px 16px; }
}

/* ---------- article share buttons (t60u) ---------- */
.pd-share { display: grid; gap: 8px; margin: 4px 0 6px; }
.pd-share-h { font-size: .74rem; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.pd-share-row { display: flex; flex-wrap: wrap; gap: 8px; }
.pd-sh {
  --sh: var(--brand-2);
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px 8px 10px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--ink);
  font: inherit; font-size: .9rem; font-weight: 600; text-decoration: none; cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.pd-sh i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-size: .95rem; color: #fff; background: var(--sh); }
.pd-sh.is-wa { --sh: #128c4a; }
.pd-sh.is-pin { --sh: #c8102e; }
.pd-sh.is-x { --sh: #0f1419; }
.pd-sh.is-fb { --sh: #1877f2; }
.pd-sh.is-copy, .pd-sh.is-native { --sh: var(--brand); }
html[data-theme="dark"] .pd-sh.is-x i { background: #f6f1e8; color: #0f1419; }
html[data-theme="dark"] .pd-sh.is-copy i, html[data-theme="dark"] .pd-sh.is-native i { background: #e2b15a; color: #141a16; }
.pd-sh:hover { border-color: color-mix(in srgb, var(--sh) 55%, var(--line)); background: color-mix(in srgb, var(--sh) 8%, var(--card)); color: var(--ink); }
.pd-sh:focus-visible { outline: 3px solid color-mix(in srgb, var(--sh) 70%, var(--ink)); outline-offset: 2px; }
html[data-theme="dark"] .pd-sh:hover { background: color-mix(in srgb, var(--sh) 18%, var(--card)); border-color: rgba(246, 241, 232, .35); }
html[data-theme="dark"] .pd-sh:focus-visible { outline-color: #e2b15a; }
.pd-sh[hidden] { display: none; }
@media (max-width: 560px) {
  .pd-share-row { display: grid; grid-template-columns: 1fr 1fr; }
  .pd-sh { justify-content: flex-start; }
}
@media (prefers-reduced-motion: no-preference) { .pd-sh:hover { transform: translateY(-1px); } }

/* ---------- Premium upsell (locked page + inline hint) ---------- */
.plock-wrap { padding: 28px 0 56px; }
.plock {
  max-width: 680px; margin: 0 auto; padding: 34px 30px 28px; text-align: center;
  background: radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--gold) 16%, transparent), transparent 60%), var(--card);
  border: 1px solid color-mix(in srgb, var(--gold) 35%, var(--line)); border-radius: 26px; box-shadow: var(--shadow);
}
.plock-ico { position: relative; display: inline-grid; place-items: center; width: 68px; height: 68px; border-radius: 20px; font-size: 1.7rem; color: var(--brand-2); background: color-mix(in srgb, var(--brand-2) 12%, transparent); }
.plock-ico b { position: absolute; right: -8px; top: -8px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-size: .8rem; color: #141a16; background: #e2b15a; box-shadow: 0 0 0 3px var(--card); }
.plock-kicker { margin: 16px 0 4px; font-size: .76rem; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
.plock h1 { margin: 0 0 10px; font-family: Fraunces, Georgia, serif; font-size: clamp(1.6rem, 3vw, 2.1rem); }
.plock-lead { margin: 0 auto 20px; max-width: 520px; color: var(--muted); line-height: 1.55; }
.plock-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.plock-actions .btn { min-height: 48px; }
.plock-note { margin: 14px 0 0; font-size: .85rem; color: var(--muted); }
.plock-alt { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.plock-alt h2 { margin: 0 0 12px; font-size: 1rem; }
.plock-alt ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.plock-alt li a { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); text-decoration: none; }
.plock-alt li a:hover, .plock-alt li a:focus-visible { border-color: var(--brand-2); }
.plock-hint {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 10px 0 0; padding: 12px 14px;
  border: 1px dashed color-mix(in srgb, var(--gold) 55%, var(--line)); border-radius: 14px;
  background: color-mix(in srgb, var(--gold) 7%, var(--card)); color: var(--ink); font-size: .92rem;
}
.plock-hint > i { color: var(--gold); }
.plock-hint a { font-weight: 650; color: var(--brand-2); text-decoration: underline; text-underline-offset: 3px; }
.plock-thumbs { display: flex; gap: 10px; margin: 0; padding: 0; list-style: none; }
.plock-thumbs img { display: block; width: 96px; height: 96px; object-fit: cover; border-radius: 12px; border: 1px solid var(--line); }
.acct-photo .plock-hint { margin: 0; flex: 1 1 220px; }
@media (max-width: 560px) { .plock { padding: 26px 18px 22px; } .plock-actions .btn { flex: 1 1 100%; } }

/* ---------- Premium package cards (account) ---------- */
.py-pkg-renew { display: flex; align-items: center; gap: 6px; margin: 6px 0 0; font-size: .82rem; color: var(--muted); }
.py-pkg-renew i { color: var(--ok); }
.py-pkg-tix { margin: 8px 0 0; }
.py-pkg-tix .btn { width: 100%; justify-content: center; min-height: 44px; }
.py-pkg-tix .btn[disabled] { opacity: .55; cursor: not-allowed; }
.py-pkg-tix small { display: block; margin-top: 6px; font-size: .8rem; color: var(--muted); text-align: center; }
.py-pkg.is-life { border-color: color-mix(in srgb, var(--gold) 50%, var(--line)); }

/* ---------- t62u A: date/time inputs never overflow their card on phones (iOS Safari gives them an intrinsic min-width) ---------- */
@media (max-width: 760px) {
  input[type="date"], input[type="datetime-local"], input[type="time"], input[type="month"] {
    display: block; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; min-height: 48px; text-align: left;
  }
  .row:has(> input[type="date"]), .row:has(> input[type="datetime-local"]), .field-grid > *, .form-card > * { min-width: 0; }
}
@media (pointer: coarse) {
  input[type="date"], input[type="datetime-local"], input[type="time"], input[type="month"] { -webkit-appearance: none; appearance: none; }
  input[type="date"]::-webkit-date-and-time-value, input[type="datetime-local"]::-webkit-date-and-time-value, input[type="time"]::-webkit-date-and-time-value { text-align: left; min-height: 1.4em; }
}