/*
  Preicfes App Mobile System v1
  Structural reference: home-preicfes-mobile.php
  Purpose: shared mobile institutional layer for all public PHP pages.
*/
:root {
  --pf-navy: #0f172a;
  --pf-navy-2: #1e293b;
  --pf-blue: #1d4ed8;
  --pf-blue-deep: #1e3a8a;
  --pf-gold: #f59e0b;
  --pf-gold-deep: #d97706;
  --pf-green: #059669;
  --pf-red: #dc2626;
  --pf-bg: #f8fafc;
  --pf-surface: #ffffff;
  --pf-ink: #0f172a;
  --pf-muted: #64748b;
  --pf-line: #e2e8f0;
  --pf-soft-blue: rgba(29, 78, 216, .10);
  --pf-soft-gold: rgba(245, 158, 11, .14);
  --pf-soft-green: rgba(5, 150, 105, .10);
  --pf-soft-slate: rgba(15, 23, 42, .07);
  --pf-radius: 18px;
  --pf-radius-lg: 24px;
  --pf-shadow-card: 0 16px 40px -24px rgba(15, 23, 42, .36), 0 1px 0 rgba(255, 255, 255, .82) inset;
  --pf-shadow-cta: 0 14px 30px -18px rgba(15, 23, 42, .68);
  --pf-font: "Sora", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --pf-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

body.pf-mobile-shell {
  --ui-action-bg: var(--pf-blue-deep);
  --ui-action-bg-hover: #172f73;
  --ui-action-accent: var(--pf-gold);
  --ui-feedback-info: var(--pf-blue);
  --ui-feedback-success: var(--pf-green);
  --ui-surface-bg-inset: var(--pf-bg);
  --ui-text-primary: var(--pf-ink);
  --ui-text-muted: var(--pf-muted);
  --ui-border-default: var(--pf-line);
  font-family: var(--pf-font) !important;
  background:
    radial-gradient(circle at 16% -10%, rgba(245, 158, 11, .18), transparent 32%),
    radial-gradient(circle at 88% 8%, rgba(29, 78, 216, .12), transparent 30%),
    var(--pf-bg) !important;
}

body.pf-mobile-shell[data-pf-track="home"],
body.pf-mobile-shell[data-pf-track="family"] {
  --ui-action-bg: var(--pf-blue-deep);
  --ui-action-bg-hover: #172f73;
  --pf-route-soft: var(--pf-soft-blue);
  --pf-route-accent: var(--pf-blue);
}

body.pf-mobile-shell[data-pf-track="subprogram"] {
  --ui-action-bg: #0f172a;
  --ui-action-bg-hover: #1e293b;
  --pf-route-soft: var(--pf-soft-gold);
  --pf-route-accent: var(--pf-gold);
}

body.pf-mobile-shell[data-pf-track="institutional"] {
  --ui-action-bg: #111827;
  --ui-action-bg-hover: #1f2937;
  --pf-route-soft: rgba(15, 23, 42, .09);
  --pf-route-accent: var(--pf-gold);
}

body.pf-mobile-shell[data-pf-track="legal"] {
  --ui-action-bg: #0f172a;
  --ui-action-bg-hover: #1e293b;
  --pf-route-soft: rgba(30, 58, 138, .08);
  --pf-route-accent: #1e3a8a;
}

body.pf-mobile-shell h1,
body.pf-mobile-shell h2,
body.pf-mobile-shell h3,
body.pf-mobile-shell h4 {
  letter-spacing: -.035em !important;
  text-wrap: balance;
}

body.pf-mobile-shell p,
body.pf-mobile-shell li,
body.pf-mobile-shell .ui-text-sm,
body.pf-mobile-shell .ui-text-xs {
  text-wrap: pretty;
}

body.pf-mobile-shell .top-bar {
  height: 58px !important;
  background: rgba(255, 255, 255, .88) !important;
  border-bottom: 1px solid rgba(148, 163, 184, .28) !important;
  box-shadow: 0 10px 34px -28px rgba(15, 23, 42, .72) !important;
  backdrop-filter: saturate(180%) blur(18px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(18px) !important;
}

body.pf-mobile-shell .top-bar::before {
  content: "";
  width: 4px;
  align-self: stretch;
  margin: 10px 0;
  border-radius: 999px;
  background: var(--pf-route-accent, var(--pf-blue));
  order: -1;
}

body.pf-mobile-shell .top-bar__title-main {
  color: var(--pf-ink) !important;
  letter-spacing: -.02em;
}

body.pf-mobile-shell .top-bar__title-sub,
body.pf-mobile-shell .role-pill,
body.pf-mobile-shell .grade-pill,
body.pf-mobile-shell .ui-badge {
  font-family: var(--pf-mono) !important;
  letter-spacing: .06em !important;
}

body.pf-mobile-shell .screen {
  padding-top: 68px !important;
  padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important;
}

body.pf-mobile-shell .ui-card,
body.pf-mobile-shell .ui-surface,
body.pf-mobile-shell .case-card,
body.pf-mobile-shell .faq__item,
body.pf-mobile-shell .faq-item,
body.pf-mobile-shell .plan-card,
body.pf-mobile-shell .pricing-card,
body.pf-mobile-shell .partners__item,
body.pf-mobile-shell .press__article,
body.pf-mobile-shell .agreements__card,
body.pf-mobile-shell .modalities__card,
body.pf-mobile-shell .voices__card,
body.pf-mobile-shell .cases__case,
body.pf-mobile-shell .legal-section {
  border-color: rgba(148, 163, 184, .26) !important;
  border-radius: var(--pf-radius) !important;
  box-shadow: var(--pf-shadow-card) !important;
}

body.pf-mobile-shell .ui-surface--inset,
body.pf-mobile-shell .legal-meta,
body.pf-mobile-shell .legal-warning,
body.pf-mobile-shell .legal-success,
body.pf-mobile-shell .legal-danger,
body.pf-mobile-shell .cases__disclaimer,
body.pf-mobile-shell .close__legal-footer,
body.pf-mobile-shell [class*="disclaimer"] {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.95)) !important;
  border: 1px solid rgba(148, 163, 184, .30) !important;
  border-left: 4px solid var(--pf-route-accent, var(--pf-blue)) !important;
  border-radius: 16px !important;
  color: var(--pf-muted) !important;
}

body.pf-mobile-shell .ui-btn {
  min-height: 46px;
  border-radius: 14px !important;
  letter-spacing: -.01em;
  box-shadow: none;
}

body.pf-mobile-shell .ui-btn--primary,
body.pf-mobile-shell .ui-btn--accent,
body.pf-mobile-shell .ui-btn--whatsapp {
  color: #fff !important;
  box-shadow: var(--pf-shadow-cta) !important;
}

body.pf-mobile-shell .ui-btn--primary {
  background: linear-gradient(135deg, var(--ui-action-bg), var(--ui-action-bg-hover)) !important;
}

body.pf-mobile-shell .ui-btn--accent {
  background: linear-gradient(135deg, var(--pf-gold), var(--pf-gold-deep)) !important;
}

body.pf-mobile-shell .ui-btn--secondary,
body.pf-mobile-shell .ui-btn--ghost {
  background: rgba(255, 255, 255, .82) !important;
  border-color: rgba(148, 163, 184, .34) !important;
  color: var(--pf-ink) !important;
}

body.pf-mobile-shell .bar {
  min-height: calc(62px + env(safe-area-inset-bottom, 0px)) !important;
  background: rgba(255, 255, 255, .90) !important;
  border-top: 1px solid rgba(148, 163, 184, .30) !important;
  box-shadow: 0 -16px 44px -34px rgba(15, 23, 42, .76) !important;
  backdrop-filter: saturate(180%) blur(18px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(18px) !important;
}

body.pf-mobile-shell .tab {
  min-height: 54px !important;
  border-radius: 15px !important;
  color: #64748b !important;
}

body.pf-mobile-shell .tab.active {
  color: var(--ui-action-bg) !important;
  background: var(--pf-route-soft, rgba(29, 78, 216, .10)) !important;
}

body.pf-mobile-shell .tab__dot,
body.pf-mobile-shell .row-dot.active {
  background: var(--pf-route-accent, var(--pf-blue)) !important;
}

body.pf-mobile-shell .doc-modal__sheet {
  border: 1px solid rgba(226, 232, 240, .9);
  border-radius: 24px !important;
  box-shadow: 0 30px 70px -30px rgba(15, 23, 42, .65) !important;
}

body.pf-mobile-shell .doc-link {
  border-color: rgba(148, 163, 184, .24) !important;
  border-radius: 14px !important;
}

body.pf-mobile-shell[data-pf-track="legal"] .screen {
  gap: 14px !important;
}

body.pf-mobile-shell[data-pf-track="legal"] .legal-section,
body.pf-mobile-shell[data-pf-track="legal"] .ui-card {
  box-shadow: none !important;
}

body.pf-mobile-shell[data-pf-track="legal"] .bar .tab__txt {
  font-size: 9px !important;
}

@media (prefers-reduced-motion: reduce) {
  body.pf-mobile-shell *,
  body.pf-mobile-shell *::before,
  body.pf-mobile-shell *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}

/* ============================================================
   Apple-style fullscreen navigation menu
   Applied to every mobile PHP through docModal.
   ============================================================ */
body.pa-menu-open { overflow: hidden !important; }
body.pf-mobile-shell .top-bar__hamburger { position: relative; transition: background .22s ease, transform .22s ease; }
body.pf-mobile-shell .top-bar__hamburger:hover,
body.pf-mobile-shell .top-bar__hamburger:focus-visible { background: rgba(15, 23, 42, .06) !important; outline: none; }
body.pa-menu-open .top-bar__hamburger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.pa-menu-open .top-bar__hamburger span:nth-child(2) { opacity: 0; transform: scaleX(.4); }
body.pa-menu-open .top-bar__hamburger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
body.pf-mobile-shell .top-bar__hamburger span { transition: transform .22s cubic-bezier(.22,.61,.36,1), opacity .18s ease; }

body.pf-mobile-shell .doc-modal {
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  background:
    radial-gradient(circle at 16% -8%, rgba(245, 158, 11, .20), transparent 34%),
    radial-gradient(circle at 92% 2%, rgba(29, 78, 216, .16), transparent 36%),
    rgba(248, 250, 252, .98) !important;
  backdrop-filter: saturate(180%) blur(26px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(26px) !important;
  z-index: 2200 !important;
}
body.pf-mobile-shell .doc-modal.is-open { display: block !important; animation: paMenuFade .18s ease-out both; }
body.pf-mobile-shell .doc-modal__sheet {
  width: 100% !important;
  max-width: none !important;
  height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.pa-menu {
  height: 100dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: calc(18px + env(safe-area-inset-top, 0px)) 18px calc(28px + env(safe-area-inset-bottom, 0px));
  color: var(--pf-ink, #0f172a);
}
.pa-menu__chrome { max-width: 1040px; margin: 0 auto; }
.pa-menu__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}
.pa-menu__brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pa-menu__mark {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 900;
  letter-spacing: -.05em;
  background: linear-gradient(135deg, var(--ui-action-bg), var(--pf-route-accent, var(--pf-gold)));
  box-shadow: 0 16px 32px -20px rgba(15, 23, 42, .75);
}
.pa-menu__eyebrow {
  display: block;
  margin-bottom: 2px;
  font-family: var(--pf-mono, ui-monospace);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pf-route-accent, var(--pf-blue));
}
.pa-menu__title { font-size: 22px; font-weight: 900; line-height: 1; letter-spacing: -.045em; }
.pa-menu__subtitle { margin-top: 5px; font-size: 13px; color: var(--pf-muted); line-height: 1.35; }
.pa-menu__close {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(148, 163, 184, .34);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, .76);
  color: var(--pf-ink);
  box-shadow: 0 16px 32px -26px rgba(15, 23, 42, .7);
}
.pa-menu__close svg { width: 18px; height: 18px; }

.pa-menu__search {
  position: sticky;
  top: calc(8px + env(safe-area-inset-top, 0px));
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 14px;
  margin-bottom: 16px;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 18px;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 18px 42px -34px rgba(15, 23, 42, .76);
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
}
.pa-menu__search svg { width: 18px; height: 18px; color: var(--pf-muted); flex: 0 0 auto; }
.pa-menu__search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--pf-ink);
  font: 700 15px/1 var(--pf-font, inherit);
}
.pa-menu__search input::placeholder { color: #94a3b8; font-weight: 600; }

.pa-menu__hero {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  padding: 22px;
  margin-bottom: 14px;
  color: #fff;
  background:
    radial-gradient(circle at 82% 0%, rgba(245, 158, 11, .45), transparent 42%),
    linear-gradient(135deg, #0f172a, #1e3a8a 66%, #1d4ed8);
  box-shadow: 0 28px 70px -42px rgba(15, 23, 42, .85);
}
.pa-menu__hero::after {
  content: "";
  position: absolute;
  right: -34px;
  bottom: -58px;
  width: 170px;
  height: 170px;
  border-radius: 999px;
  border: 28px solid rgba(255, 255, 255, .10);
}
.pa-menu__hero h2 { position: relative; z-index: 1; margin: 0 0 8px; color: #fff !important; font-size: clamp(28px, 8vw, 46px); line-height: .96; letter-spacing: -.06em; }
.pa-menu__hero p { position: relative; z-index: 1; max-width: 680px; margin: 0; color: rgba(255,255,255,.78) !important; font-size: 14px; line-height: 1.55; }
.pa-menu__dock { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 18px; }
.pa-menu__dock a {
  min-height: 58px;
  padding: 10px 8px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  gap: 5px;
  text-align: center;
  background: rgba(255,255,255,.12);
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.16);
  font-size: 11px;
  font-weight: 800;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.pa-menu__dock svg { width: 20px; height: 20px; }

.pa-menu__grid { display: grid; gap: 12px; }
.pa-menu__section {
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 18px 45px -36px rgba(15, 23, 42, .72);
}
.pa-menu__section-toggle {
  width: 100%;
  min-height: 58px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 0;
  background: transparent;
  color: var(--pf-ink);
  text-align: left;
}
.pa-menu__section-icon {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--pf-route-soft, rgba(29,78,216,.1));
  color: var(--ui-action-bg);
  flex: 0 0 auto;
}
.pa-menu__section-icon svg { width: 18px; height: 18px; }
.pa-menu__section-title { display: block; font-size: 15px; font-weight: 900; letter-spacing: -.025em; }
.pa-menu__section-sub { display: block; margin-top: 2px; color: var(--pf-muted); font-size: 11px; font-weight: 600; }
.pa-menu__chevron { margin-left: auto; width: 18px; height: 18px; color: var(--pf-muted); transition: transform .2s ease; }
.pa-menu__section.is-collapsed .pa-menu__chevron { transform: rotate(-90deg); }
.pa-menu__items { display: grid; gap: 8px; padding: 0 10px 12px; }
.pa-menu__section.is-collapsed .pa-menu__items { display: none; }
.pa-menu__item {
  position: relative;
  min-height: 62px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border: 1px solid rgba(226, 232, 240, .82);
  border-radius: 18px;
  background: rgba(248,250,252,.86);
  color: var(--pf-ink) !important;
  text-decoration: none !important;
  text-align: left;
}
button.pa-menu__item { width: 100%; font: inherit; }
.pa-menu__item:hover,
.pa-menu__item:focus-visible { outline: 0; border-color: rgba(29, 78, 216, .36); background: #fff; transform: translateY(-1px); }
.pa-menu__item.is-active { border-color: rgba(29, 78, 216, .42); background: linear-gradient(135deg, rgba(239,246,255,.96), rgba(255,255,255,.92)); }
.pa-menu__item-icon {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: #fff;
  color: var(--ui-action-bg);
  box-shadow: inset 0 0 0 1px rgba(226,232,240,.9);
}
.pa-menu__item-icon svg { width: 19px; height: 19px; }
.pa-menu__item-title { display: block; font-size: 14px; font-weight: 900; line-height: 1.1; letter-spacing: -.025em; }
.pa-menu__item-desc { display: block; margin-top: 4px; color: var(--pf-muted); font-size: 11px; font-weight: 600; line-height: 1.25; }
.pa-menu__tag {
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .06);
  color: var(--pf-muted);
  font-family: var(--pf-mono, ui-monospace);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pa-menu__item[data-kind="primary"] .pa-menu__tag { background: rgba(245,158,11,.18); color: #92400e; }
.pa-menu__item[data-kind="whatsapp"] .pa-menu__item-icon { color: #16a34a; }
.pa-menu__item[data-kind="whatsapp"] .pa-menu__tag { background: rgba(37,211,102,.16); color: #15803d; }
.pa-menu__empty { display: none; padding: 20px; text-align: center; color: var(--pf-muted); font-size: 13px; font-weight: 700; }
.pa-menu.is-searching .pa-menu__section-toggle { pointer-events: none; }
.pa-menu.is-searching .pa-menu__section.is-collapsed .pa-menu__items { display: grid; }
.pa-menu.no-results .pa-menu__empty { display: block; }

@media (min-width: 720px) {
  .pa-menu { padding-inline: 34px; }
  .pa-menu__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .pa-menu__hero { padding: 32px; }
  .pa-menu__dock { max-width: 520px; }
}
@media (min-width: 1024px) {
  .pa-menu__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@keyframes paMenuFade { from { opacity: 0; } to { opacity: 1; } }
