/* Infojara — charcoal, ocean teal and quiet editorial space. */
:root{--p:#212a31;--s:#124e66;--a:#d3d9d4;--a2:#b6c5bf;--bg:#212a31;--bg2:#263139;--card:#2e3944;--line:#46535c;--muted:#b2bfbe;--ink:#f0f2ed;--head:'Manrope',sans-serif;--body:'Manrope',sans-serif;--side:236px}
body{line-height:1.65}a,button{touch-action:manipulation}a,button,input,select,textarea{transition:background-color .2s,color .2s,border-color .2s,transform .2s}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #a7c8ce;outline-offset:5px}h1,h2,h3{text-wrap:balance}button{font-family:inherit}::selection{background:#748d92;color:white}
.pub h1,.pub h2,.pub h3,.adm h1,.adm h2,.adm h3{font-family:var(--head);letter-spacing:-.045em;text-transform:none;font-weight:500}.pwrap{max-width:1320px;padding-inline:56px}.ptop{padding:18px 56px;background:#212a31f5;backdrop-filter:blur(16px);border-color:#ffffff16;min-height:88px}.pbrand{gap:12px;font-family:var(--body);font-weight:600;text-transform:none;letter-spacing:-.06em;font-size:30px}.pbrand .brand-logo{height:48px;width:57px;object-fit:contain}.desktop-nav{display:flex;gap:32px;margin-left:auto;margin-right:54px;align-items:center}.desktop-nav a{font-size:13px;color:#c4cecb}.desktop-nav a:hover,.desktop-nav a.active{color:white}.ptop-right{gap:24px}.nav-login{color:#d3d9d4!important;font-size:13px}.pburger{width:36px}.pburger span{height:1px}.btn-gold,.pub .btn-brand,.pub .btn-primary,.pub .btn-vip,.pub .btn-accent{background:#d3d9d4;color:#212a31!important;border-radius:4px;padding:14px 23px;font-size:13px;font-weight:600}.btn-gold:hover{background:#edf0eb;transform:translateY(-2px);filter:none}.btn-ghost{border-radius:4px;font-size:13px;font-weight:500;padding:14px 23px}.btn-pill{padding:11px 20px}.hero{position:relative;isolation:isolate;overflow:hidden;min-height:650px;height:calc(100svh - 88px);max-height:850px;display:flex;align-items:center;background:#212a31;padding:60px 0}.hero-photo{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:center 57%;filter:saturate(.35)}.hero:before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(24,37,44,.95) 0%,rgba(25,43,52,.83) 48%,rgba(20,54,67,.32) 100%)}.hero:after{content:'';position:absolute;width:38vw;height:38vw;right:8%;top:12%;z-index:-1;border:1px solid #d3d9d44a;border-radius:50%;box-shadow:0 0 0 55px #d3d9d407}.hero .pwrap{text-align:left!important;width:100%}.hero-kicker,.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.21em;display:flex;gap:12px;align-items:center;color:#b2c4c3}.hero-kicker:before{content:'';width:24px;height:1px;background:#a4b8b8}.hero-brand{display:block;font-size:clamp(70px,12vw,172px);font-weight:400;letter-spacing:-.085em;line-height:1.05;color:#d3d9d4;margin:16px 0 6px}.hero h1{font-size:clamp(34px,4.2vw,59px);line-height:1.08;margin:0 0 24px;max-width:730px}.hero .l1,.hero .l2{color:#e3e8e3}.hero-sub{font-size:14px;line-height:1.85;max-width:385px;margin:0 0 27px;color:#bdcbc9}.hero-actions{display:flex;max-width:none;margin:0;gap:12px}.hero-foot{position:absolute;bottom:27px;left:56px;right:56px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d3d9d42e;padding-top:18px;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#c5d0cd}.hero-scroll{color:#d3d9d4!important;letter-spacing:0;font-size:20px}.hero-kicker,.hero-brand,.hero h1,.hero-sub,.hero-actions{animation:rise-in .85s both}.hero h1{animation-delay:.08s}.hero-sub{animation-delay:.16s}.hero-actions{animation-delay:.24s}@keyframes rise-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.psec{padding:80px 0}.psec+.psec{border-top:1px solid #ffffff12}.section-intro{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:32px}.shead{gap:14px}.shead h1,.shead h2{font-size:clamp(30px,3.5vw,46px);line-height:1.15;text-transform:none;letter-spacing:-.045em;color:var(--ink)}.section-intro .muted{font-size:13px;max-width:300px;margin:12px 0 0}.section-intro .more{margin:0;white-space:nowrap;font-size:12px}.stag{background:none;border:1px solid #748d9280;color:#b6cccb;font-size:9px;padding:4px 10px;font-weight:500;letter-spacing:.1em}.fchips{gap:26px;border-bottom:1px solid var(--line);padding:0;margin-bottom:30px}.fchip{background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:13px 0;font-size:12px;font-weight:500}.fchip.on{background:none;color:var(--ink);border-color:#b3c9c7}.tgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.tcard{border:0;border-top:1px solid #748d9266;border-radius:0;background:none;padding:25px 0 6px;min-height:245px}.tcard-top{width:100%;justify-content:space-between}.chip{padding:0;background:none;color:#9dbbbf;font-size:9px;font-weight:500;letter-spacing:.12em}.chip-free,.chip-vip{color:#bac9c5;background:none}.tcard h3{font-size:21px;line-height:1.4;margin:23px 0 12px;font-weight:500;letter-spacing:-.025em}.tcard p{font-size:13px;line-height:1.85}.tlink{font-size:11px;font-weight:500;padding:6px 0;border-bottom:1px solid #748d9270}.tcard:hover .tlink{color:white;border-color:white}.statcard{display:none}.more{font-size:12px}.vipcard{background:#124e66;border:0;border-radius:0;padding:48px 52px;display:grid;grid-template-columns:1fr auto;column-gap:60px;align-items:center;margin-bottom:44px}.vipcard:after{right:20px;top:25px;color:#d3d9d4;opacity:.08}.vip-pill{grid-column:1;background:none;color:#b5d1d6;padding:0;font-size:10px;letter-spacing:.15em}.vipcard h2{font-size:40px;line-height:1.15;text-transform:none;color:#edf0e9;grid-column:1;max-width:620px;margin:15px 0}.vipcard p{grid-column:1;font-size:13px;margin:0;max-width:530px;color:#c1d2d4}.vipcard .btn-block{grid-column:2;grid-row:1/4;width:auto;z-index:1}.vipcard+.shead{margin-bottom:20px}.howgrid{gap:40px;margin-top:38px}.how{border:0;border-top:1px solid var(--line);border-radius:0;background:none;padding:25px 0}.how b{background:none;display:block;text-align:left;color:#91adb2;font-size:12px;width:auto;height:auto}.how h3{font-size:19px;margin:20px 0 10px}.how p{font-size:13px;max-width:300px}.plans{gap:0;margin-top:38px;border:1px solid var(--line)}.plan{background:none;border:0;border-right:1px solid var(--line);border-radius:0;padding:36px}.plan:last-child{border-right:0}.plan-hot{background:#2e3944;box-shadow:none;border:0;border-right:1px solid var(--line)}.plan-flag{background:#748d92;color:#fff;right:20px;border-radius:0;font-weight:500;font-size:9px}.plan h3{font-size:22px;text-transform:none}.plan-price{font-size:40px;font-weight:400;margin:22px 0 8px;letter-spacing:-.05em}.plan-price small{letter-spacing:0;font-size:11px}.plan-desc,.plan-list li{font-size:12px}.plan-list{margin:24px 0}.plan-list li:before{color:#a9c3bf}.faq{border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;padding:23px 0;margin:0}.faq summary{font-weight:500;font-size:15px;padding-right:20px}.faq p{font-size:13px;max-width:850px}.pfoot{background:#1c252b;text-align:left;padding:60px 0 30px;margin-top:0}.pfoot-brand{font-family:var(--body);text-transform:none;letter-spacing:-.07em;font-size:65px}.pfoot-links{justify-content:flex-start;gap:14px 25px;margin:25px 0}.pfoot-links a{font-size:12px}.pfoot-note{margin:35px 0 0;font-size:10px;max-width:none;border-top:1px solid var(--line);padding-top:25px}.pfoot-soc{justify-content:flex-start}.pbar{background:#212a31f5;backdrop-filter:blur(12px)}.pbar a{font-size:8px;font-weight:500}.pbar a i{font-size:20px}.pwa{width:48px;height:48px;background:#124e66;font-size:22px}.tpage{border-radius:3px;padding:40px;max-width:900px;margin:auto}.tpage h1{font-size:clamp(30px,4vw,50px);line-height:1.15;text-transform:none}.tlead{font-size:17px}.pub .card,.pub .alert,.pub pre.code{border-radius:4px}.pub .form-control,.pub .form-select{border-radius:4px;min-height:46px}.pub .form-control:focus,.adm .form-control:focus{border-color:#91b6bc;box-shadow:0 0 0 3px #748d9226}.pub .btn-primary{border-radius:4px}.ditem{font-size:14px}.ditem i{font-size:17px}.pbrand-sm{font-family:var(--body);letter-spacing:-.05em}.dvip{border-radius:4px}.dvip-t{font-family:var(--body);font-size:20px}.dvip p{font-size:12px}.skel{background:#748d9226;border-radius:0;height:9px}.pub [hidden]{display:none!important}
/* Shared workspace and authentication surfaces. */
.adm-brand{padding:30px 24px}.adm-brand img{width:63px;height:53px;object-fit:contain;margin-bottom:16px}.adm-brand-name{font-family:var(--body);font-size:28px;letter-spacing:-.06em;text-transform:none}.adm-brand-sub{font-size:9px;margin-top:12px}.adm-nav{padding:0 14px}.adm-nav a{border-radius:4px;padding:10px 12px;font-size:12px;color:#bac6c7}.adm-nav a.active{background:#124e66;color:#e2ecea}.adm-content{padding:32px 36px;max-width:1600px}.adm-head{margin-bottom:30px}.adm-head h1{font-size:32px;text-transform:none;line-height:1.2}.adm .card,.panel,.kpi{border-radius:4px;box-shadow:none}.kpi{border-top:0;padding:23px}.kpi-n{font-family:var(--body);font-size:34px;letter-spacing:-.05em}.kpi-i{display:none}.panel-h h2{font-family:var(--body);text-transform:none;font-size:18px;letter-spacing:-.03em}.adm .btn{border-radius:4px;font-size:12px;padding:9px 15px}.adm .btn-primary,.adm .btn-warning,.btn-gold-s{background:#d3d9d4;border-color:#d3d9d4;color:#212a31}.adm .form-control,.adm .form-select{border-radius:4px;padding:11px 13px;font-size:13px}.adm .table{font-size:12px}.adm .table th{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em}.adm .card-header{padding:18px 22px}.adm .card-body{padding:22px}.adm-auth{background:#212a31}.auth-wrap{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;padding:0}.auth-story{position:relative;padding:65px;min-height:100%;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(#123c4dd9,#192d39e8),url('../images/editorial-workspace.jpg') center/cover}.auth-story .auth-wordmark{font-size:70px;letter-spacing:-.075em;color:#d3d9d4}.auth-story h2{font-size:52px;line-height:1.12;max-width:500px}.auth-story p{font-size:13px;color:#c0cfcc;max-width:320px}.auth-story small{font-size:10px;color:#afc2c3;letter-spacing:.12em;text-transform:uppercase}.auth-card{width:min(100% - 64px,420px);margin:60px auto;align-self:center;background:none;border:0;box-shadow:none;padding:0}.auth-card .auth-logo{width:90px;height:70px;object-fit:contain;margin-bottom:24px}.auth-card h1{font-size:30px!important;letter-spacing:-.05em}.auth-card .auth-heading{text-align:left!important;margin-bottom:30px!important}.auth-card .small{font-size:12px}.auth-card .form-label{font-size:12px}.auth-card .btn-primary{padding:13px}.auth-card .text-muted{margin-top:10px}.skip-link{position:fixed;top:-100px;left:20px;z-index:9999;background:#d3d9d4;color:#212a31!important;padding:10px 16px}.skip-link:focus{top:10px}
@media(min-width:992px){.ptop-right .pburger{display:none}.hero-photo{animation:photo-settle 1.8s both}@keyframes photo-settle{from{transform:scale(1.04)}to{transform:scale(1)}}}
@media(max-width:1100px){.desktop-nav{gap:20px;margin-right:30px}.pwrap{padding-inline:32px}.ptop{padding-inline:32px}.hero-foot{left:32px;right:32px}.vipcard{padding:35px}.plan{padding:25px}}
@media(max-width:991px){.desktop-nav{display:none}.hero{min-height:650px;height:calc(100svh - 85px);max-height:800px}.hero-brand{font-size:120px}.hero:after{width:55vw;height:55vw;right:-10%;top:20%}.tgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.auth-story{padding:36px}.auth-story h2{font-size:40px}.plans{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}.adm-content{padding:24px}.vipcard{column-gap:25px}.vipcard h2{font-size:30px}}
@media(max-width:600px){.pwrap{padding-inline:22px}.ptop{min-height:76px;padding:13px 22px}.pbrand{font-size:26px;gap:8px}.pbrand .brand-logo{height:39px;width:44px}.ptop-right{gap:12px}.nav-login{display:none}.btn-pill{font-size:10px;padding:9px 12px}.hero{min-height:610px;height:calc(100svh - 140px);padding:50px 0 95px}.hero-brand{font-size:clamp(65px,20vw,115px);margin-top:24px}.hero h1{font-size:36px;margin-top:12px;max-width:350px}.hero-sub{font-size:12px;max-width:290px}.hero-kicker{font-size:8px}.hero-photo{object-position:64% center}.hero:before{background:linear-gradient(90deg,#192d38ef,#192d38a8)}.hero-foot{left:22px;right:22px;font-size:8px;bottom:25px}.hero-actions{gap:10px}.hero-actions a{font-size:11px;padding:13px 16px}.psec{padding:50px 0}.section-intro{display:block;margin-bottom:24px}.section-intro .more{display:inline-block;margin-top:16px}.tgrid{grid-template-columns:1fr;gap:20px}.tcard{min-height:220px}.tcard h3{font-size:22px;margin-top:18px}.fchips{gap:22px}.vipcard{display:block;padding:30px 25px}.vipcard h2{font-size:33px}.vipcard p{margin-bottom:25px}.vipcard .btn-block{width:fit-content}.howgrid{gap:10px}.how h3{margin-top:12px}.plans{display:block}.plan,.plan-hot{border:0;border-bottom:1px solid var(--line);padding:30px}.plan:last-child{border:0}.plan-flag{top:15px}.pfoot-brand{font-size:52px}.pfoot-links{gap:12px 20px}.pfoot-note{line-height:1.8}.auth-wrap{display:block;padding:35px 0}.auth-story{display:none}.auth-card{margin:20px auto;width:calc(100% - 44px)}.tpage{padding:25px 20px}.adm-content{padding:20px 15px}.adm-head h1{font-size:26px}.pub .plans{overflow:hidden}.pub .tgrid>div{min-width:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.ui-icon{display:inline-block;vertical-align:middle;flex:none}.pbar .ui-icon{width:21px;height:21px}.adm-nav .ui-icon{width:17px;height:17px}.adm-logout button{display:flex;align-items:center;justify-content:center;gap:10px}

/* The supplied logo is the header wordmark; the hero leads with the editorial headline. */
.hero h1{margin:24px 0 28px}.pbrand .brand-logo{width:78px;height:52px}
@media(max-width:600px){.hero h1{margin:26px 0 24px}.pbrand .brand-logo{width:62px;height:42px}}

/* Light blue is the main canvas; charcoal and teal anchor key sections. */
body.pub,
body.adm {
  --bg: #e3e6ea;
  --bg2: #edf0f3;
  --card: #f3f5f7;
  --line: #bcc7ce;
  --muted: #51636e;
  --ink: #212a31;
  --a: #124e66;
  --a2: #0c3b4e;
  background: var(--bg);
  color: var(--ink);
}

.hero, .ptop, .pdrawer, .pfoot, .pbar, .vipcard, .adm-side, .auth-story,
.plan-hot {
  --bg: #212a31;
  --bg2: #263139;
  --card: #2e3944;
  --line: #46535c;
  --muted: #b2bfbe;
  --ink: #f0f2ed;
  --a: #d3d9d4;
  --a2: #b6c5bf;
  color: var(--ink);
}

.pub .psec + .psec { border-top-color: #bdc8cf; }
.pub #how { background: #d6dfe4; }
.pub .eyebrow, .pub .chip, .pub .how b { color: #335f6f; }
.pub .stag { color: #124e66; border-color: #8fa8b3; }
.pub .tcard h3, .pub .how h3, .pub .plan h3,
.pub .faq summary, .pub .tpage h1, .pub .tsteps strong { color: var(--ink); }
.pub .tcard { border-top-color: #a8b9c2; }
.pub .tcard:hover .tlink { color: #0c3b4e; border-color: #124e66; }
.pub .fchip { color: #51636e; }
.pub .fchip.on { color: #124e66; border-bottom-color: #124e66; }
.pub .skel { background: #c1cdd4; }
.pub .plan-hot { background: #2e3944; }
.pub .plan-flag { background: #124e66; color: #fff; }
.pub .plan-list li::before { color: #124e66; }
.pub .plan-hot .plan-list li::before { color: #b9d1ce; }
.pub .tpage, .pub pre.code { background: #f3f5f7; }
.pub pre.code { color: #263d49; }
.pub .btn-gold, .pub .btn-brand, .pub .btn-primary,
.pub .btn-vip, .pub .btn-accent {
  background: #124e66;
  color: #fff !important;
}
.pub .btn-gold:hover, .pub .btn-brand:hover, .pub .btn-primary:hover {
  background: #0c3b4e;
}
.pub :is(.hero, .ptop, .pdrawer, .vipcard, .plan-hot) .btn-gold {
  background: #d3d9d4;
  color: #212a31 !important;
}
.pub :is(.hero, .ptop, .pdrawer, .vipcard, .plan-hot) .btn-gold:hover {
  background: #edf0eb;
}
.pub .form-control, .pub .form-select,
.adm .form-control, .adm .form-select { background: #f3f5f7; color: #212a31; }
.pub .form-control::placeholder, .adm .form-control::placeholder { color: #61747f; }
.pub .btn-close { filter: none; }
.pub .page-item.active .page-link { color: #fff; }

.adm .adm-head h1, .adm .kpi-n, .adm .panel-h h2,
.adm .card-header, .adm .form-label, .adm .auth-card h1 { color: #212a31; }
.adm .card, .adm .panel, .adm .kpi { background: #f3f5f7; }
.adm .btn-primary, .adm .btn-warning, .adm .btn-gold-s {
  background: #124e66;
  border-color: #124e66;
  color: #fff;
}
.adm .btn-primary:hover { background: #0c3b4e; color: #fff; }
.adm .btn-outline-primary:hover { color: #fff; }
.adm .btn-outline-secondary:hover { color: #212a31; }
.adm .table { --bs-table-color: #212a31; }
.adm .btn-mini { color: #124e66 !important; }
.adm .auth-wrap { background: #e3e6ea; }
.adm .adm-side { background: #263139; }
.adm .adm-side .adm-logout button { color: #f0f2ed; }
.pub .form-control:focus, .pub .form-select:focus,
.adm .form-control:focus, .adm .form-select:focus {
  background: #f3f5f7;
  color: #212a31;
}
.pub .mhello h1, .pub .vipstate h2,
.pub .kpi-n, .pub .panel-h h2 { color: #212a31; }
.adm .btn-close { filter: none; }
.adm .nav-tabs .nav-link:hover { color: #124e66; }
.adm .badge.bg-info { background: #c5dce5 !important; color: #124e66 !important; }
.adm .btn-outline-success, .btn-mini.b-green, .p-green { color: #166534 !important; }
.adm .btn-outline-danger, .btn-mini.b-red, .p-red { color: #a12626 !important; }
.adm .btn-outline-success:hover, .adm .btn-outline-danger:hover { color: #fff !important; }
.p-blue { color: #124e66; }

body.pub-home { padding-bottom: 0; }
.pub-home .pwa { bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 600px) {
  .pub-home .hero { height: calc(100svh - 76px); }
}

/* Editorial photographs support browsing; the VIP example uses our real graphic renderer. */
.tip-visual {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: #ccd6dc;
  margin-bottom: 23px;
}
.tip-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.65);
  transition: transform .45s ease, filter .3s ease;
}
a.tip-visual:hover img { transform: scale(1.035); filter: saturate(.9); }
.pub .tcard { padding-top: 0; border-top: 0; }
.pub .vipcard { grid-template-columns: minmax(0, 1fr) minmax(200px, 290px); gap: 60px; }
.vip-copy { min-width: 0; }
.vip-copy h2 { max-width: 570px; }
.vip-copy p { margin-bottom: 25px; }
.vip-copy .btn-block { width: fit-content; }
.vip-preview { margin: 0; position: relative; z-index: 1; }
.vip-preview > a { display: block; }
.vip-preview img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 16px 35px #102c3b55;
  transform: rotate(3deg);
  transition: transform .3s ease;
}
.vip-preview > a:hover img { transform: rotate(0); }
.vip-preview figcaption {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 22px;
  color: #d3e1e2;
  font-size: 10px;
}
.vip-preview figcaption span { text-transform: uppercase; letter-spacing: .1em; }
.vip-preview figcaption a { color: #e3e6ea; text-decoration: underline; text-underline-offset: 4px; }
.about-visual { margin: 32px auto; max-width: 1100px; }
.about-visual img { display: block; width: 100%; height: auto; aspect-ratio: 2.2 / 1; object-fit: cover; object-position: center 40%; filter: saturate(.65); }
.about-visual figcaption { color: #51636e; font-size: 11px; margin-top: 12px; }
.about-intro h1 { font-size: clamp(38px, 5vw, 66px); line-height: 1.12; margin: 20px 0 24px; max-width: 850px; }
.about-lead { max-width: 760px; color: #405762; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.85; margin-bottom: 44px; }
.about-intro .about-visual { max-width: none; margin: 0 0 64px; }
.about-story { max-width: 1080px; }
.about-section { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 64px; padding: 35px 0; border-top: 1px solid #bcc7ce; }
.about-section h2 { font-size: 25px; line-height: 1.3; margin: 0; color: #212a31; }
.about-section p, .about-paragraph p { margin: 0; color: #405762; font-size: 15px; line-height: 1.9; }
.about-paragraph { padding: 28px 0; max-width: 800px; }
.about-next { background: #124e66; color: #edf0eb; padding: 60px 0; }
.about-next .pwrap { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.about-next .eyebrow { color: #b9d2d6; }
.about-next h2 { font-size: clamp(28px, 3vw, 42px); margin: 15px 0 12px; }
.about-next p { margin: 0; color: #cfdee1; font-size: 13px; }
.about-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; flex-shrink: 0; }
.pub .about-next .btn-gold { background: #d3d9d4; color: #212a31 !important; }
.pub .about-next .btn-gold:hover { background: #edf0eb; }
.pub .about-membership { color: #e3e6ea; font-size: 12px; }
@media (max-width: 991px) { .about-section { grid-template-columns: 220px minmax(0, 1fr); gap: 30px; } }
@media (max-width: 600px) {
  .about-intro .about-visual { margin-bottom: 36px; }
  .about-lead { margin-bottom: 30px; }
  .about-section { grid-template-columns: 1fr; gap: 16px; padding: 28px 0; }
  .about-section h2 { font-size: 24px; }
  .about-section p, .about-paragraph p { font-size: 14px; }
  .about-next { padding: 42px 0; }
  .about-next .pwrap { flex-direction: column; align-items: flex-start; gap: 28px; }
}
@media (max-width: 991px) { .pub .vipcard { gap: 30px; grid-template-columns: minmax(0, 1fr) 220px; } }
@media (max-width: 600px) {
  .pub .vipcard { display: flex; flex-direction: column; align-items: stretch; gap: 36px; }
  .vip-preview { width: min(100% - 14px, 280px); align-self: center; }
  .tip-visual { margin-bottom: 20px; }
  .about-visual img { aspect-ratio: 4 / 3; }
}

/* ===== Workspace identity: admin + member dashboards, Lucide icons ===== */
.adm, .pub { --ij-teal: #124e66; --ij-deep: #0c3b4e; --ij-ink: #212a31; --ij-soft: #d3d9d4; --ij-card: #f3f5f7; --ij-line: #cfd8de; --ij-muted: #5b6d77; }
.tone-teal { --tone: #124e66; --tone-bg: #dbe8ed; }
.tone-green { --tone: #166534; --tone-bg: #dcefe3; }
.tone-amber { --tone: #8a5a00; --tone-bg: #f5e8cc; }
.tone-slate { --tone: #2e3944; --tone-bg: #e1e6ea; }

/* Icons inside controls */
.btn-mini .ui-icon, .btn-gold-s .ui-icon { width: 15px; height: 15px; }
.btn-mini, .btn-gold-s { gap: .45rem; }
.btn .ui-icon, .btn-gold .ui-icon, .card-header .ui-icon, .link-icon .ui-icon { width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }
.card-header .ui-icon { color: var(--ij-teal); }
.chip .ui-icon, .stag .ui-icon { width: 12px; height: 12px; margin-right: 5px; vertical-align: -1px; }
.link-icon { display: inline-flex; align-items: center; }

/* Sidebar */
.adm .adm-side { background: linear-gradient(180deg, #1d3b48 0, #212a31 260px); border-right: 0; }
.adm-brand { padding: 26px 24px 20px; border-bottom: 1px solid #ffffff12; }
.adm-brand img { margin-bottom: 12px; }
.adm-brand-sub { color: #9db3b6; letter-spacing: .16em; }
.adm-nav { padding: 6px 14px 14px; }
.adm-nav-group { margin: 18px 12px 6px; font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #8aa1a5; }
.adm-nav a { position: relative; gap: 12px; padding: 9px 12px; border-radius: 6px; font-size: 13px; color: #c3cdcd; }
.adm-nav a .ui-icon { width: 18px; height: 18px; opacity: .78; }
.adm-nav a:hover { background: #ffffff0d; color: #fff; }
.adm-nav a:hover .ui-icon, .adm-nav a.active .ui-icon { opacity: 1; }
.adm-nav a.active { background: var(--ij-teal); color: #fff; font-weight: 600; }
.adm-nav a.active::before { content: ""; position: absolute; left: -14px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--ij-soft); }
.adm-nav-ext { margin-top: 14px; }
.adm-nav-ext::after { content: ""; position: absolute; left: 12px; right: 12px; top: -8px; border-top: 1px solid #ffffff12; }
.adm-nav .adm-nav-ext .adm-nav-ext-i { width: 14px; height: 14px; margin-left: auto; opacity: .55; }
.adm-me { display: flex; align-items: center; gap: 11px; padding: 14px 16px; border-top: 1px solid #ffffff14; }
.adm-me-av { width: 34px; height: 34px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--ij-teal); color: #e3e6ea; font-weight: 600; font-size: 14px; box-shadow: 0 0 0 2px #ffffff1f; }
.adm-me-t { min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.adm-me-t strong { font-size: 12.5px; font-weight: 600; color: #eef1ec; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-me-t small { font-size: 11px; color: #9db3b6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-me .adm-logout { margin: 0 0 0 auto; padding: 0; border: 0; }
.adm .adm-me .adm-logout button { width: 34px; height: 34px; padding: 0; display: grid; place-items: center; background: transparent; border: 1px solid #ffffff22; border-radius: 6px; color: #c3cdcd; }
.adm .adm-me .adm-logout button:hover { background: #ffffff12; color: #fff; }
.adm-me .adm-logout .ui-icon { width: 16px; height: 16px; }

/* Page header */
.adm-head h1 { font-weight: 600; letter-spacing: -.04em; }
.adm-upd { font-size: 12px; color: var(--ij-muted); }
.adm-burger .ui-icon { width: 20px; height: 20px; }
.adm .adm-burger { background: var(--ij-card); border-color: var(--ij-line); color: var(--ij-ink); }

/* Buttons */
.adm .btn-mini, .pub .btn-mini { background: #fff; border: 1px solid var(--ij-line); color: var(--ij-teal) !important; border-radius: 6px; padding: 7px 12px; font-size: 12px; }
.adm .btn-mini:hover, .pub .btn-mini:hover { border-color: var(--ij-teal); background: #eef4f6; }
.btn-mini.b-green { border-color: #9cc9ad; } .btn-mini.b-green:hover { background: #dcefe3; border-color: #166534; }
.btn-mini.b-red { border-color: #e0a9a9; } .btn-mini.b-red:hover { background: #f6dede; border-color: #a12626; }
.adm .btn-gold-s, .pub .btn-gold-s { background: var(--ij-teal); color: #fff !important; border-radius: 6px; padding: 8px 14px; font-size: 12px; font-weight: 600; }
.adm .btn-gold-s:hover, .pub .btn-gold-s:hover { background: var(--ij-deep); }

/* KPI cards */
.kpis { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; margin-bottom: 18px; }
.adm .kpi, .pub .kpi { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: start; background: var(--ij-card); border: 1px solid var(--ij-line); border-radius: 8px; padding: 18px; }
.kpi .kpi-i { display: grid; place-items: center; grid-row: 1 / 4; width: 42px; height: 42px; border-radius: 9px; background: var(--tone-bg, #dbe8ed); color: var(--tone, #124e66); }
.kpi .kpi-i .ui-icon { width: 21px; height: 21px; }
.kpi .kpi-l { grid-column: 2; font-size: 12px; font-weight: 500; color: var(--ij-muted); opacity: 1; }
.adm .kpi .kpi-n, .pub .kpi .kpi-n { grid-column: 2; font-family: var(--body); font-size: 28px; font-weight: 600; letter-spacing: -.04em; line-height: 1.15; margin: 3px 0 2px; color: var(--ij-ink); font-variant-numeric: tabular-nums; }
.kpi .kpi-s { grid-column: 2; font-size: 11.5px; color: #61747f; margin: 0; }

/* Quick actions */
.qa { gap: 8px; margin-bottom: 22px; }
.quick { margin-top: 18px; padding-top: 14px; border-top: 1px dashed var(--ij-line); }
.quick > span { font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ij-muted); margin-right: 4px; }

/* Panels */
.adm .panel, .pub .panel { background: var(--ij-card); border: 1px solid var(--ij-line); border-radius: 8px; padding: 20px 22px; margin-bottom: 18px; }
.grid2, .grid3 { gap: 18px; margin-bottom: 18px; }
.panel-h { gap: 10px; margin-bottom: 16px; }
.adm .panel-h h2, .pub .panel-h h2 { display: flex; align-items: center; gap: 11px; font-family: var(--body); font-size: 16px; font-weight: 600; letter-spacing: -.02em; color: var(--ij-ink); }
.panel-h h2 .ui-icon { width: 30px; height: 30px; padding: 6px; border-radius: 7px; background: #dbe8ed; color: var(--ij-teal); }
.panel-sub { font-size: 12px; color: var(--ij-muted); }
.panel-sub2 { font-size: 12px; color: var(--ij-muted); margin: -8px 0 14px; }
.dot-g { background: #2f8f5b; box-shadow: 0 0 0 3px #dcefe3; }

/* Feature switches */
.adm .tg { background: #fff; border: 1px solid #d5dde2; border-radius: 6px; padding: 10px 12px; font-size: 12.5px; font-weight: 500; color: var(--ij-ink); }
.adm .tg:hover { border-color: #9fb7c1; }
.tg-l .ui-icon { width: 16px; height: 16px; color: var(--ij-teal); }
.switch b { background: #c3ced5; }
.switch input:checked + b { background: var(--ij-teal); }
.switch input:focus-visible + b { outline: 2px solid #91b6bc; outline-offset: 2px; }

/* Plan revenue bars */
.hbar { grid-template-columns: 110px 1fr auto; font-size: 12.5px; }
.hbar div { background: #e1e7eb; }
.adm .hbar i { background: linear-gradient(90deg, #4f8195, var(--ij-teal)); }
.adm .hbar b { color: var(--ij-teal); font-variant-numeric: tabular-nums; }

/* Activity tables */
.panel > .table-responsive { margin: 0 -22px -8px; }
.dtable { font-size: 13px; }
.adm .dtable thead th, .pub .dtable thead th { background: #e9eef1; color: var(--ij-muted); font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; padding: 10px 12px; border-top: 1px solid var(--ij-line); border-bottom: 1px solid var(--ij-line); white-space: nowrap; }
.dtable td { padding: 12px; border-bottom: 1px solid #dde4e8; }
.dtable > tbody > tr:last-child > td { border-bottom: 0; }
.dtable > tbody > tr:hover > * { --bs-table-bg-state: #e9f0f3; }
.panel .dtable th:first-child, .panel .dtable td:first-child { padding-left: 22px; }
.panel .dtable th:last-child, .panel .dtable td:last-child { padding-right: 22px; }
.cell-main { display: block; font-weight: 600; color: var(--ij-ink) !important; line-height: 1.4; }
a.cell-main:hover { color: var(--ij-teal) !important; text-decoration: underline; text-underline-offset: 3px; }
.cell-sub { font-size: 11.5px; color: #61747f; }
.cell-num { font-variant-numeric: tabular-nums; font-weight: 600; }
.pill { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 99px; letter-spacing: .01em; text-transform: capitalize; border: 0; }
.pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.adm .p-green, .pub .p-green { background: #dcefe3; }
.adm .p-red, .pub .p-red { background: #f6dede; }
.adm .p-gold, .pub .p-gold { background: #dbe8ed; color: var(--ij-teal); }
.adm .p-gray, .pub .p-gray { background: #e4e9ec; color: var(--ij-muted); border: 0; }
.adm .p-blue, .pub .p-blue { background: #e1e8ea; color: #3f5a60; }

/* Empty states */
.empty { color: #61747f; font-size: 13px; padding: 26px 12px; text-align: center; }
.empty .ui-icon { display: block; width: 38px; height: 38px; margin: 0 auto 10px; padding: 9px; border-radius: 50%; background: #e4e9ec; color: #748d92; }
.empty a { color: var(--ij-teal); font-weight: 600; }

/* System + activity timeline */
.sys li { border-bottom-color: #dde4e8; font-size: 13px; padding: 9px 0; }
.sys li:last-child { border-bottom: 0; }
ol.act { list-style: none; padding: 0; margin: 0; }
.act li { display: block; position: relative; padding: 0 0 15px 24px; border: 0; font-size: 12.5px; }
.act li::before { content: ""; position: absolute; left: 3px; top: 6px; width: 9px; height: 9px; border-radius: 50%; background: #2f8f5b; box-shadow: 0 0 0 3px #dcefe3; }
.act li.bad::before { background: #a12626; box-shadow: 0 0 0 3px #f6dede; }
.act li::after { content: ""; position: absolute; left: 7px; top: 19px; bottom: 2px; width: 1px; background: var(--ij-line); }
.act li:last-child { padding-bottom: 0; }
.act li:last-child::after { display: none; }
.act-t { display: block; color: var(--ij-ink); line-height: 1.45; }
.act-t strong { font-weight: 600; }
.act li small { display: block; margin: 2px 0 0; color: #61747f; font-size: 11px; }

/* Member dashboard */
.mhello { position: relative; overflow: hidden; isolation: isolate; gap: 18px; padding: 26px 28px; border: 0; border-radius: 10px; background: linear-gradient(120deg, #124e66, #0c3b4e 72%); color: #edf0eb; margin-bottom: 18px; }
.mhello::after { content: ""; position: absolute; z-index: -1; width: 260px; height: 260px; right: -60px; top: -110px; border: 1px solid #d3d9d440; border-radius: 50%; box-shadow: 0 0 0 40px #d3d9d40a; }
.mavatar { width: 56px; height: 56px; background: var(--ij-soft); color: var(--ij-teal); font-family: var(--body); font-weight: 600; font-size: 24px; box-shadow: 0 0 0 3px #ffffff26; }
.mhello-k { display: block; font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #b9d2d6; margin-bottom: 4px; }
.pub .mhello h1 { color: #fff; font-family: var(--body); font-size: 30px; font-weight: 600; letter-spacing: -.045em; text-transform: none; }
.pub .mhello p { color: #c9d9dc; font-size: 13px; }
.mhello-plan { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border-radius: 99px; border: 1px solid #ffffff40; color: #e3e6ea; font-size: 12px; font-weight: 600; white-space: nowrap; }
.mhello-plan.on { background: var(--ij-soft); border-color: var(--ij-soft); color: var(--ij-teal); }
.mhello-plan .ui-icon { width: 15px; height: 15px; }
.pub .vipstate { background: var(--ij-card); border: 1px solid var(--ij-line); border-radius: 8px; padding: 20px 22px; margin-bottom: 18px; }
.pub .vipstate.on { background: linear-gradient(160deg, #e3eef2, var(--ij-card)); border-color: #9fbfcb; }
.pub .vipstate h2 { display: flex; align-items: center; gap: 10px; font-family: var(--body); font-size: 20px; font-weight: 600; letter-spacing: -.03em; text-transform: none; color: var(--ij-ink); }
.vipstate h2 .ui-icon { width: 22px; height: 22px; color: var(--ij-teal); }
.pub .vbar { background: #dfe6ea; }
.pub .vbar i { background: linear-gradient(90deg, #4f8195, var(--ij-teal)); }
.pub .mtip { background: #fff; border: 1px solid #d5dde2; border-radius: 8px; padding: 14px 16px; color: var(--ij-ink) !important; transition: border-color .2s, transform .2s, box-shadow .2s; }
.pub .mtip:hover { border-color: var(--ij-teal); transform: translateY(-1px); box-shadow: 0 6px 16px #124e6614; }
.mtip strong { display: flex; gap: 8px; align-items: flex-start; font-weight: 600; line-height: 1.4; }
.mtip strong .ui-icon { width: 15px; height: 15px; flex: none; margin-top: 3px; color: #748d92; }
.pub .mtip small { color: #61747f; font-size: 11.5px; margin-top: 4px; }
.mstats { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.mstats > div { background: #fff; border: 1px solid #d5dde2; border-radius: 8px; padding: 12px 16px; min-width: 150px; }
.pub .mstats .kpi-n { font-family: var(--body); font-size: 24px; font-weight: 600; letter-spacing: -.04em; color: var(--ij-ink); }
.mstats .kpi-s { font-size: 11.5px; color: #61747f; }
.dvip-t { display: flex; align-items: center; gap: 8px; }
.dvip-t .ui-icon { width: 18px; height: 18px; }
.pdrawer-head button .ui-icon { width: 20px; height: 20px; }

@media (max-width: 767.98px) {
  .kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .adm .kpi, .pub .kpi { grid-template-columns: 1fr; padding: 14px; }
  .kpi .kpi-i { grid-row: auto; width: 34px; height: 34px; margin-bottom: 10px; }
  .kpi .kpi-i .ui-icon { width: 18px; height: 18px; }
  .kpi .kpi-l, .kpi .kpi-s { grid-column: 1; }
  .adm .kpi .kpi-n, .pub .kpi .kpi-n { grid-column: 1; font-size: 22px; }
  .adm .panel, .pub .panel { padding: 16px; }
  .panel > .table-responsive { margin: 0 -16px -6px; }
  .panel .dtable th:first-child, .panel .dtable td:first-child { padding-left: 16px; }
  .panel .dtable th:last-child, .panel .dtable td:last-child { padding-right: 16px; }
  .mhello { flex-wrap: wrap; padding: 22px 20px; }
  .mhello-plan { margin-left: 0; }
  .pub .mhello h1 { font-size: 26px; }
}

/* ===== Marketing pages: Lucide icons in place of text glyphs ===== */
:root { --m-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); --m-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E"); --m-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E"); --m-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h10v10'/%3E%3Cpath d='M7 17 17 7'/%3E%3C/svg%3E"); }
.ui-icon.i-trail { width: 1em; height: 1em; margin: 0 0 0 .4em !important; vertical-align: -.14em; transition: transform .2s ease; }
a:hover > .ui-icon.i-trail, a:focus-visible > .ui-icon.i-trail { transform: translateX(3px); }
.back .ui-icon { width: 1em; height: 1em; margin-right: .4em; vertical-align: -.14em; }
.back { display: inline-flex; align-items: center; }
.hero-scroll .ui-icon { width: 22px; height: 22px; }
.stat-row .ui-icon { width: 14px; height: 14px; vertical-align: -2px; }
.plan-list li::before { content: ""; top: .32em; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--m-check) center / contain no-repeat; mask: var(--m-check) center / contain no-repeat; }
.faq summary::after { content: ""; width: 18px; height: 18px; margin-top: 3px; background: currentColor; -webkit-mask: var(--m-plus) center / contain no-repeat; mask: var(--m-plus) center / contain no-repeat; }
.faq[open] summary::after { content: ""; -webkit-mask-image: var(--m-minus); mask-image: var(--m-minus); }
.vipcard::after { content: ""; width: 210px; height: 210px; background: currentColor; -webkit-mask: var(--m-arrow) center / contain no-repeat; mask: var(--m-arrow) center / contain no-repeat; }
@media (prefers-reduced-motion: reduce) { a:hover > .ui-icon.i-trail { transform: none; } }