/* ===============================
   TELGWEN USER.CSS - CASSIOPEIA SAFE
=============================== */

:root{
  --brand-green:#16a34a;
  --brand-green-dark:#0f7a38;
  --text-dark:#111;
}

/* BASE */

body{
  font-family:'Poppins', Arial, sans-serif;
  color:var(--text-dark);
  line-height:1.6;
}

a{
  color:var(--brand-green);
  text-decoration:none;
}

a:hover{
  color:var(--brand-green-dark);
}

/* TYPOGRAPHY */

h1,h2,h3,h4,h5{
  font-weight:700;
  line-height:1.2;
  color:#111;
}

h1{font-size:2.2rem;}
h2{font-size:1.8rem;}
h3{font-size:1.4rem;}

h2::after{
  content:'';
  width:50px;
  height:3px;
  background:var(--brand-green);
  display:block;
  margin-top:8px;
}

/* BUTTONS */

.btn,
button,
input[type="submit"]{
  background:linear-gradient(135deg,var(--brand-green),var(--brand-green-dark));
  color:#fff;
  padding:12px 22px;
  border-radius:6px;
  border:none;
  font-weight:600;
  display:inline-block;
}

/* FULL WIDTH SUPPORT */

.full-width{
  width:100vw;
  margin-left:calc(50% - 50vw);
}

/* CASSIOPEIA CLEANUP */

.card{
  border:none;
  box-shadow:none;
  background:none;
}

.moduletable{
  margin:0;
  padding:0;
}

.container-footer .grid-child{
  max-width:1200px;
  margin:0 auto;
}

/* ===============================
   HEADER - SAFE FIX
=============================== */

.container-header{
  background:#fff !important;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
}

/* keep logo area clean */
.container-header .grid-child{
  padding:12px 20px;
}

/* centre nav row */
.container-header .container-nav{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0 20px 18px 20px;
}

/* main menu */
.container-header ul.mod-menu{
  display:flex !important;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:34px;
  list-style:none;
  margin:0;
  padding:0;
  background:transparent !important;
  box-shadow:none !important;
}

/* menu items */
.container-header ul.mod-menu > li{
  margin:0 !important;
  padding:0 !important;
  position:relative;
  background:transparent !important;
  box-shadow:none !important;
}

/* menu links */
.container-header ul.mod-menu > li > a{
  display:inline-block;
  color:var(--brand-green) !important;
  background:transparent !important;
  font-weight:700;
  font-size:1rem;
  padding:8px 4px;
  border-radius:0;
  text-decoration:none;
  box-shadow:none !important;
}

/* hover */
.container-header ul.mod-menu > li > a:hover{
  color:var(--brand-green-dark) !important;
}

/* active */
.container-header ul.mod-menu > li.active > a,
.container-header ul.mod-menu > li.current > a{
  color:var(--brand-green-dark) !important;
  background:transparent !important;
}

/* IMPORTANT: hide dropdown box unless hovering */
.container-header ul.mod-menu ul.mod-menu__sub{
  display:none !important;
  position:absolute;
  top:100%;
  left:0;
  min-width:220px;
  background:#fff;
  padding:10px 0;
  margin:0;
  list-style:none;
  box-shadow:0 8px 24px rgba(0,0,0,.15);
  z-index:9999;
}

/* show dropdown on hover */
.container-header ul.mod-menu li:hover > ul.mod-menu__sub{
  display:block !important;
}

/* dropdown links */
.container-header ul.mod-menu ul.mod-menu__sub li a{
  display:block;
  color:var(--brand-green) !important;
  background:#fff !important;
  padding:10px 16px;
  font-weight:600;
  white-space:nowrap;
}

.container-header ul.mod-menu ul.mod-menu__sub li a:hover{
  background:#f3fdf6 !important;
  color:var(--brand-green-dark) !important;
}

/* FOOTER */

.container-footer{
  background:#111;
  color:#ccc;
  padding:40px 20px;
}

.container-footer a{
  color:#fff;
}

.container-footer a:hover{
  color:var(--brand-green);
}

/* CONTENT */

p{margin-bottom:15px;}
ul{padding-left:20px;}
li{margin-bottom:6px;}

/* MOBILE */

@media(max-width:768px){

  h1{font-size:1.8rem;}
  h2{font-size:1.5rem;}

  .container-header .container-nav{
    padding:10px 15px 18px 15px;
  }

  .container-header ul.mod-menu{
    flex-wrap:wrap;
    gap:12px 18px;
  }

  .container-header ul.mod-menu > li > a{
    font-size:.9rem;
  }

}