/* ============================================================
   ParkBit — corporate site
   Typography and colour taken from ParkBit · Brand DNA GR
   and Brand System v1.0. Logo geometry measured from the
   supplied PB_logo sample.
   ============================================================ */

:root{
  --blue:#2F6BF0;      /* Aegean Blue · primary  */
  --teal:#10B6A2;      /* Sea Teal · the Node    */
  --navy:#0E2A66;      /* Deep Navy              */
  --ink:#141923;
  --slate:#5B6577;
  --mist:#F4F7FB;
  --line:#E4E8EF;
  --teal-bg:#EAFBF7;
  --teal-tx:#0B7F71;

  /* Greek sets in IBM Plex Sans throughout, as in the Brand DNA GR.
     Plus Jakarta Sans carries no Greek and is used only for the
     Latin lovemark. Labels use Plex Mono for Latin and figures and
     fall through to Plex Sans for Greek, which Plex Mono lacks. */
  --greek:'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  --latin:'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
  --mono:'IBM Plex Mono','IBM Plex Sans', ui-monospace,'SFMono-Regular', monospace;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--mist);color:var(--ink);
  font-family:var(--greek);font-size:17px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:6px}
.wrap{max-width:960px;margin:0 auto;padding:0 28px}

.eyebrow{
  font-family:var(--mono);font-size:11px;font-weight:500;
  letter-spacing:.18em;color:var(--slate);
}
.eyebrow.blue{color:var(--blue)}

/* ============================================================
   LOGO — the primary lockup, drawn as outlines so it renders
   identically everywhere. Colours inherit the tokens above.
   ============================================================ */
.logo{display:block;height:auto}
.logo-link{display:inline-block;line-height:0;text-decoration:none}

/* ============================================================
   THE LOVEMARK
   "love parking" set in Plus Jakarta Sans 700, Deep Navy.
   The Node is the full stop — never a typed period. Measured
   from the Brand DNA GR: diameter .13em, sitting on the
   baseline, .06em clear of the "g". Marketing surfaces only.
   ============================================================ */
.lovemark{
  font-family:var(--latin);font-weight:700;
  font-size:clamp(46px,10vw,92px);letter-spacing:-.035em;line-height:1.05;
  color:var(--navy);
}
.lovemark .node{
  display:inline-block;vertical-align:baseline;position:relative;
  width:.13em;height:.13em;border-radius:50%;background:var(--teal);
  margin-left:.06em;
}
.lovemark .node::before{
  content:"";position:absolute;inset:0;border-radius:50%;background:var(--teal);
  animation:pulse 2.8s ease-out infinite;
}
@keyframes pulse{0%{transform:scale(1);opacity:.5}70%{transform:scale(3.4);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .lovemark .node::before{animation:none}
  *{transition:none!important}
}

/* ============================================================
   Top bar
   ============================================================ */
.topbar{
  position:sticky;top:0;z-index:20;
  background:rgba(244,247,251,.86);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar-inner{
  max-width:960px;margin:0 auto;padding:14px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.topbar .logo{width:112px}
.toplink{font-size:14px;font-weight:500;color:var(--slate);text-decoration:none}
.toplink:hover{color:var(--navy)}

/* ============================================================
   HOME
   ============================================================ */
.home{position:relative;min-height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.home .net{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}
.home-inner{
  position:relative;flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:44px;padding:96px 28px 56px;text-align:center;
}
.home .logo{width:clamp(230px,50vw,380px)}
.actions{display:flex;flex-direction:column;align-items:center;gap:15px}
.btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:14px 26px;border-radius:999px;background:var(--blue);color:#fff;
  font-family:var(--greek);font-size:16px;font-weight:600;
  text-decoration:none;transition:background .18s ease;
}
.btn .dot{width:8px;height:8px;border-radius:50%;background:var(--teal);flex:none}
.btn:hover{background:#255BD6}
.home-foot{position:relative;padding:0 28px 30px;text-align:center}
.home-foot p{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--slate)}
.home-foot a{color:var(--slate)}

/* ============================================================
   CORPORATE TRANSPARENCY
   Brand DNA GR section grammar: hairline-ruled blocks on Mist,
   data in the values grid device.
   ============================================================ */
.page{min-height:100dvh;display:flex;flex-direction:column}
.masthead{padding:72px 0 8px}
.masthead .eyebrow{display:block;margin-bottom:22px}
.masthead h1{
  font-weight:700;font-size:clamp(32px,6vw,54px);
  letter-spacing:-.03em;line-height:1.05;color:var(--navy);margin-bottom:18px;
}
.masthead .statute{font-size:17px;color:var(--slate);max-width:60ch}

section.block{padding:52px 0;border-top:1px solid var(--line)}
section.block:first-of-type{border-top:none}
.block-head{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.block-head .eyebrow{white-space:nowrap}
.rule{flex:1;height:1px;background:var(--line)}

.grid{
  display:grid;gap:2px;background:var(--line);
  border-radius:18px;overflow:hidden;border:1px solid var(--line);
}
.row{
  background:#fff;padding:22px 30px;
  display:grid;grid-template-columns:minmax(190px,34%) 1fr;gap:6px 24px;align-items:baseline;
}
.row dt{font-size:14.5px;font-weight:400;color:var(--slate);line-height:1.5}
.row dd{font-size:18px;font-weight:600;color:var(--ink);line-height:1.45;letter-spacing:-.01em;overflow-wrap:anywhere}
.row dd.fig{font-family:var(--mono);font-weight:500;font-size:17px;letter-spacing:0}
.row dd a{color:var(--blue);font-family:var(--mono);font-weight:500;font-size:17px;text-decoration:none}
.row dd a:hover{text-decoration:underline}

.group-mark{
  display:inline-flex;align-items:center;gap:9px;margin-bottom:14px;
  padding:6px 13px;border-radius:999px;background:var(--teal-bg);
}
.group-mark .dot{width:8px;height:8px;border-radius:50%;background:var(--teal)}
.group-mark span{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--teal-tx)}
.group + .group{margin-top:28px}

.statement{display:flex;gap:16px;align-items:flex-start;max-width:800px}
.statement .node{
  width:13px;height:13px;border-radius:50%;background:var(--teal);
  margin-top:.55em;flex-shrink:0;box-shadow:0 0 0 5px var(--teal-bg);
}
.statement p{font-weight:400;font-size:clamp(20px,3.1vw,27px);line-height:1.42;letter-spacing:-.01em}
.statement .note{margin-top:14px;font-size:15px;line-height:1.6;color:var(--slate);max-width:62ch;letter-spacing:0}

.colophon{
  max-width:960px;margin:0 auto;padding:22px 28px 34px;border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-family:var(--mono);font-size:10.5px;color:var(--slate);letter-spacing:.04em;
}

@media(max-width:640px){
  .wrap,.topbar-inner,.colophon{padding-left:20px;padding-right:20px}
  .masthead{padding-top:48px}
  section.block{padding:38px 0}
  .row{grid-template-columns:1fr;gap:4px;padding:18px 20px}
  .home-inner{gap:34px;padding:72px 20px 44px}
  .topbar .logo{width:100px}
}
@media print{
  body{background:#fff}
  .topbar{display:none}
  .grid,.statement,.group{break-inside:avoid}
}
