/* ============================================================
   GoAdmio — Dark Mode Theme (consolidated)
   Palette:
     --bg       #000000   page background
     --surface  #111111   header / footer / cards
     --border   #2a2a2a   dividers & outlines
     --text     #eaeaea   primary text
     --muted    #9aa0a6   secondary text
     --orange   #FF6A00   primary accent   (hover #e05e00)
     --teal     #00A4A6   secondary accent (hover #008a8c)
   ============================================================ */

:root{
  --bg:#000000;
  --surface:#111111;
  --border:#2a2a2a;
  --text:#eaeaea;
  --muted:#9aa0a6;
  --orange:#FF6A00;
  --orange-h:#e05e00;
  --teal:#00A4A6;
  --teal-h:#008a8c;
}

/* ---------- Base ---------- */
.Body,
.BodyB {
  background: var(--bg);
  color: var(--text);
  font-family: Helvetica, Arial, sans-serif;
  margin: 0;
}
.BodyB { background: var(--surface); }   /* slightly raised, still dark */

form { margin:0; padding:0; }

/* ---------- Generic links ---------- */
a.Link:link,
a.Link:visited { font-weight:normal; font-size:12px; color:var(--text); font-family:Helvetica,Arial,sans-serif; }
a.Link:active,
a.Link:hover  { color:var(--orange); text-decoration:none; }
.Link { font-weight:normal; font-size:12px; color:var(--text); font-family:Helvetica,Arial,sans-serif; }

/* ---------- Header ---------- */
.THeader {
  background: var(--surface);
  position: fixed;
  border-bottom: 1px solid var(--border);
}
#Pc a { margin-left:50px; display:inline-block; }

a.Header:link,
a.Header:visited { font-weight:400; color:var(--text); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }
a.Header:active,
a.Header:hover  { color:var(--orange); text-decoration:none; }
.Header { font-weight:400; font-size:.9375rem; color:var(--text); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; line-height:60px; }
.HeaderB { font-weight:600; font-size:1.3rem; color:var(--orange); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; line-height:30px; padding-left:20px; }

/* ---------- Layout utils ---------- */
.Div20 { width:20%; display:inline-block; }
.Div30 { width:30%; display:inline-block; }
.Div40 { width:40%; display:inline-block; }
.Div45 { width:45%; display:inline-block; }
.Div49 { width:49%; display:inline-block; }
.Div50 { width:50%; display:inline-block; }
.Div60 { width:60%; display:inline-block; }
.Div70 { width:70%; display:inline-block; }

.DomainBorder { margin:10px; border:1px solid var(--border); border-radius:20px; }
.Menu { position:absolute; top:18px; left:12px; display:none; cursor:pointer; }
.Logo { width:100px; height:60px; background:url(../image/logo.svg) no-repeat left center; background-size:30px; }

/* ---------- Footer ---------- */
a.Footer:link,
a.Footer:visited { font-weight:400; color:var(--muted); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }
a.Footer:active,
a.Footer:hover  { color:var(--orange); text-decoration:none; }
.Footer { font-weight:400; font-size:.9375rem; color:var(--muted); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; line-height:36px; }
.FooterB { font-weight:400; font-size:1rem; color:var(--text); text-decoration:none; font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif; line-height:48px; }

/* Footer column list styling — matches class="FooterCol" in footer.php */
.FooterCol li { border-bottom:1px solid var(--border); list-style-type:none; }

/* ---------- Contact / Support ---------- */
a.Contact:link, a.Contact:visited,
a.Contact:active, a.Contact:hover { font-weight:600; font-size:1.5rem; color:var(--text); text-decoration:none; font-family:"Helvetica Neue",Helvetica,Arial; }
.Contact { font-weight:600; font-size:1.5rem; color:var(--text); text-decoration:none; font-family:"Helvetica Neue",Helvetica,Arial; }

a.Support:link, a.Support:visited,
a.Support:active, a.Support:hover { font-weight:400; font-size:1.1rem; color:var(--orange); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }

/* ---------- Headings ---------- */
.H1,  .H1K, .H1A, .H1B, .H1BK { margin:0; font-size:24px; font-family:Helvetica,Arial,sans-serif; line-height:48px; }
.H1  { font-weight:normal; color:var(--text); }
.H1A { font-weight:normal; color:var(--text); }
.H1K { font-weight:normal; color:var(--text); }
.H1B, .H1BK { font-weight:600; color:var(--text); }

.H2, .H2A, .H2B, .H2K { margin:0; font-size:20px; font-family:Helvetica,Arial,sans-serif; line-height:40px; }
.H2, .H2A { font-weight:normal; color:var(--text); }
.H2B, .H2K { font-weight:bold;   color:var(--text); }

.H3, .H3A, .H3B { margin:0; font-size:16px; font-family:Helvetica,Arial,sans-serif; line-height:40px; }
.H3, .H3A { font-weight:normal; color:var(--text); }
.H3B { font-weight:bold; color:var(--text); }

.H4, .H4A, .H4B { margin:0; font-size:12px; font-family:Helvetica,Arial,sans-serif; line-height:40px; }
.H4, .H4A { font-weight:normal; color:var(--text); }
.H4B { font-weight:bold; color:var(--text); }

/* ---------- Body text ---------- */
.Column  { font-weight:normal; font-size:15px; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; line-height:36px; }
.ColumnZ { font-weight:normal; font-size:15px; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; }
.ColumnB { font-weight:400;    font-size:18px; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; }
.ColumnT { font-weight:600;    font-size:20px; color:var(--text); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; line-height:40px; }

a.ColumnD:link,
a.ColumnD:visited { font-weight:600; font-size:1.3rem; color:var(--orange); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }
a.ColumnD:active,
a.ColumnD:hover  { color:var(--orange-h); text-decoration:none; }

a.ColumnZ:link, a.ColumnZ:visited,
a.ColumnZ:active, a.ColumnZ:hover { font-weight:normal; font-size:15px; color:var(--text); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }

.Down   { font-weight:normal; font-size:16px; color:var(--text);  text-decoration:none; font-family:Helvetica,Arial,sans-serif; line-height:36px; }
.DownK  { font-weight:normal; font-size:16px; color:var(--text);  text-decoration:none; font-family:Helvetica,Arial,sans-serif; line-height:36px; }
.DownB  { font-weight:normal; font-size:16px; color:var(--muted); text-decoration:none; font-family:Helvetica,Arial,sans-serif; line-height:36px; }

.Description,
.DescriptionK { font-weight:normal; font-size:16px; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; line-height:24px; }

/* ---------- Buttons ---------- */
a.SignUp:link, a.SignUp:visited, a.SignUp:active, a.SignUp:hover,
.SignUp { background:var(--orange); padding:10px; font-weight:400; font-size:.8rem; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; border-radius:30px; margin-left:4px; }
a.SignUp:hover { background:var(--orange-h); }

a.Login:link, a.Login:visited, a.Login:active, a.Login:hover,
.Login { background:transparent; padding:10px; font-weight:400; font-size:.8rem; color:var(--orange); text-decoration:none; font-family:Helvetica,Arial,sans-serif; border:1px solid var(--orange); margin-left:4px; border-radius:30px; }
a.Login:hover { background:var(--orange); color:#000; }

.Start { width:300px; background:var(--orange); line-height:50px; text-align:center; font-weight:400; font-size:1.6rem; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; border-radius:4px; }
.Start:hover { background:var(--orange-h); }

.Button,
.ButtonB { padding:12px; line-height:50px; text-align:center; font-weight:400; font-size:1.2rem; text-decoration:none; font-family:Helvetica,Arial,sans-serif; border:2px solid var(--orange); color:var(--orange); }
.Button:hover,
.ButtonB:hover  { background:var(--orange); border-color:var(--orange); color:#000; }

.InputText { border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:Arial; font-size:15px; height:40px; margin-top:5px; padding:8px; }

.InputButton { font-weight:normal; font-size:.9375rem; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; padding:8px; border:1px solid var(--teal); background:var(--teal); color:var(--text); cursor:pointer; transition:all .3s ease-in-out; }
.InputButton:hover { border-color:var(--teal-h); background:var(--teal-h); }

/* ---------- White / WhiteB helpers ---------- */
a.White:link, a.White:visited, a.White:active, a.White:hover,
.White { font-weight:400; font-size:1rem; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; }

a.WhiteB:link, a.WhiteB:visited, a.WhiteB:active, a.WhiteB:hover,
.WhiteB { font-weight:700; font-size:1rem; color:var(--text); text-decoration:none; font-family:Helvetica,Arial,sans-serif; }

/* ---------- Tables ---------- */
.Table     { width:95%; max-width:1200px; }
.MenuTable { width:100%; max-width:1200px; }

/* ---------- Pricing links ---------- */
a.BuyOrange:link, a.BuyOrange:visited { font-weight:600; font-size:1.3rem; color:var(--orange); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }
a.BuyOrange:active, a.BuyOrange:hover { color:var(--orange-h); }

a.BuyBlue:link, a.BuyBlue:visited { font-weight:600; font-size:1.3rem; color:var(--teal); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }
a.BuyBlue:active, a.BuyBlue:hover { color:var(--teal-h); }

a.BuyGray:link, a.BuyGray:visited { font-weight:600; font-size:1.3rem; color:var(--muted); text-decoration:none; font-family:Roboto,"Helvetica Neue",Helvetica,Arial; }
a.BuyGray:active, a.BuyGray:hover { color:var(--text); }

/* ---------- Pricing cards ---------- */
.W2Orange, .W2Blue, .W2Gray { background:var(--surface); width:400px; margin:12px; display:inline-block; padding-bottom:12px; }
.W2Orange { border:1px solid var(--orange); }
.W2Blue   { border:1px solid var(--teal); }
.W2Gray   { border:1px solid var(--border); }
.W2Orange li, .W2Blue li, .W2Gray li { width:100%; line-height:48px; list-style-type:none; text-align:center; margin-bottom:12px; }
.W2Orange li { background:var(--orange); }
.W2Blue li   { background:var(--teal); }
.W2Gray li   { background:var(--muted); }

.W3     { width:305px; margin:12px; display:inline-table; padding-bottom:12px; }
.W4     { width:265px; margin:12px; display:inline-table; height:200px; }

.W3Gray, .W3Orange, .W3Blue { background:var(--surface); width:305px; margin:12px; display:inline-block; padding-bottom:12px; }
.W3Gray   { border:1px solid var(--border); }
.W3Orange { border:1px solid var(--orange); }
.W3Blue   { border:1px solid var(--teal); }
.W3Gray li, .W3Orange li, .W3Blue li { width:100%; line-height:48px; list-style-type:none; text-align:center; margin-bottom:12px; }
.W3Gray li   { background:var(--muted); }
.W3Orange li { background:var(--orange); }
.W3Blue li   { background:var(--teal); }

/* ---------- Misc ---------- */
.CR { font-weight:normal; font-size:.79012rem; color:var(--muted); text-decoration:none; font-family:Helvetica,Arial,sans-serif; }
.W4Image { width:64px; height:64px; }
.W5Image { width:100px; height:100px; border:8px solid var(--border); border-radius:100px; }

.Yes, .MenuYes, .Whatsapp { display:none; }

/* ---------- Responsive ---------- */
@media only screen and (max-width: 1278px) {
  .Header { font-size:1rem; line-height:30px; }
  #Mob div { padding-left:20px; height:30px; }
  .Start { width:100%; }

  .W2Orange, .W2Blue, .W2Gray,
  .W3Gray, .W3Orange, .W3Blue { width:95%; }

  .Menu { display:block; }
  .Logo { width:100px; height:48px; background:url(../image/logo.svg) no-repeat center center; background-size:30px; }

  .THeader { position:relative; }
  #Header div { width:100%; height:60px; margin-left:20px; }
  .DHeader { display:none; }

  .Div20, .Div30, .Div40, .Div45, .Div49, .Div50, .Div60, .Div70 { width:100%; }

  .DomainBorder { margin:0 0 10px 0; }

  .No { display:none; }
  .Yes { display:inline; }
  .MenuYes { display:inline-table; }
  .Whatsapp { display:inline-table; }
}