
:root{
  --primary:#d24c43;
  --dark:#111827;
  --light:#f8fafc;
}
*{box-sizing:border-box}
html,body{
  margin:0;
  padding:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  font-size:16px;
  line-height:1.6;
  color:#111827;
  background:#fff;
}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1140px;margin:0 auto;padding:0 1rem}

.topbar{
  background:#0b1220;
  color:#cbd5e1;
  font-size:.875rem;
}
.topbar .container{
  display:flex;
  gap:.75rem;
  justify-content:center;
  padding:.5rem 1rem;
  flex-wrap:wrap;
}
.badge{
  display:inline-block;
  background:#111827;
  color:#f9fafb;
  border:1px solid #374151;
  border-radius:.5rem;
  padding:.25rem .5rem;
  font-size:.75rem;
}

.header{
  border-bottom:1px solid #e5e7eb;
  background:#fff;
  position:sticky;
  top:0;
  z-index:40;
}
.header-inner{
  padding:1rem 0 1.1rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.85rem;
}
.brand{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
}
.brand .logo{
  display:flex;
  justify-content:center;
  align-items:center;
}
.brand .logo img{
  max-height:110px;
  width:auto;
  height:auto;
  display:block;
}
.menu-header{
  width:100%;
  display:flex;
  justify-content:center;
}
.menu-header ul,
.menu-header .mod-menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;
}
.menu-header li{margin:0;padding:0}
.menu-header a{
  display:inline-block;
  padding:.5rem .75rem;
  border-radius:.6rem;
  color:#111827;
  font-weight:600;
}
.menu-header a:hover{
  background:#f3f4f6;
  text-decoration:none;
}
.nav{display:none}

.hero{
  background:linear-gradient(135deg,var(--dark),#1f2937);
  color:#fff;
  padding:3rem 0 3.5rem;
  border-bottom:4px solid var(--primary);
}
.hero .content{display:grid;gap:1.5rem}
.hero h1{
  margin:0 0 .5rem;
  font-size:2rem;
  line-height:1.2;
}
.hero p{margin:0 0 1rem;max-width:760px}
.btn{
  display:inline-block;
  padding:.75rem 1rem;
  border-radius:.75rem;
  background:var(--primary);
  color:#fff;
  font-weight:700;
}
.btn:hover{text-decoration:none;filter:brightness(.95)}

.site-messages,
.breadcrumb-area{
  margin-top:1.25rem;
}
.main-content{
  margin-top:1.5rem;
  margin-bottom:2.5rem;
}
.content-shell{
  max-width:980px;
  margin:0 auto;
  padding:0;
}
.jdoc-content{
  min-height:220px;
}
.content-shell > *:first-child{margin-top:0}

.bottom-area{
  margin-top:2rem;
}

.footer{
  background:#0b1220;
  color:#cbd5e1;
  padding:2.5rem 0;
  margin-top:3rem;
  text-align:center;
}
.footer a{color:#e5e7eb}
.footer-main{margin-bottom:1rem}
.footer-copy{
  border-top:1px solid #243044;
  margin-top:1.25rem;
  padding-top:1rem;
  font-size:.875rem;
  color:#94a3b8;
}

@media (max-width:900px){
  .brand .logo img{max-height:96px}
  .hero{padding:2.5rem 0 3rem}
  .hero h1{font-size:1.7rem}
  .menu-header ul,
  .menu-header .mod-menu{
    gap:.35rem;
  }
  .menu-header a{
    padding:.45rem .55rem;
    font-size:.95rem;
  }
}


/* Editable homepage intro and service card module areas */
.home-intro {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.uke-services {
  background: #fff;
  padding: 2rem 0 1rem;
}

.uke-section-header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 2rem;
}

.uke-section-header h2 {
  font-size: 2rem;
  line-height: 1.2;
  margin: 0 0 .75rem;
  color: #111827;
}

.uke-section-header p {
  margin: 0;
  color: #6b7280;
}

.uke-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
}

.uke-service-card {
  border: 1px solid #e5e7eb;
  border-radius: 1.25rem;
  padding: 1.5rem;
  background: #fff;
  box-shadow: 0 10px 25px rgba(17, 24, 39, .06);
}

.uke-service-icon {
  width: 44px;
  height: 44px;
  border-radius: .9rem;
  background: var(--primary);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 800;
  margin-bottom: 1rem;
}

.uke-service-card h3,
.uke-service-card .custom h3 {
  margin: 0 0 .75rem;
  font-size: 1.25rem;
  color: #111827;
}

.uke-service-card p {
  color: #4b5563;
  margin: 0 0 1rem;
}

.uke-service-card ul {
  margin: 0;
  padding-left: 1.1rem;
  color: #374151;
}

.uke-service-card li {
  margin: .25rem 0;
}

.uke-service-card strong {
  color: #111827;
}

.home-after-services {
  margin-top: 2rem;
}

@media (max-width: 1100px) {
  .uke-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .uke-services {
    padding: 1.5rem 0 .5rem;
  }

  .uke-section-header h2 {
    font-size: 1.65rem;
  }

  .uke-service-grid {
    grid-template-columns: 1fr;
  }
}


/* UKE BAU service modules – polished editable cards */
.uke-services {
  background: #f8fafc;
  padding: 3.5rem 0;
  margin-top: 2.5rem;
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
}

.uke-section-header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 2.25rem;
}

.uke-section-header h2 {
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  line-height: 1.15;
  margin: 0 0 .85rem;
  color: #111827;
}

.uke-section-header p {
  margin: 0 auto;
  color: #6b7280;
  max-width: 680px;
}

.uke-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: stretch;
}

.uke-service-card {
  position: relative;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 1.35rem;
  padding: 1.75rem;
  background: #fff;
  box-shadow: 0 14px 35px rgba(17, 24, 39, .07);
  min-height: 260px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.uke-service-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: var(--primary);
}

.uke-service-card:hover {
  transform: translateY(-3px);
  border-color: rgba(210, 76, 67, .35);
  box-shadow: 0 20px 45px rgba(17, 24, 39, .11);
}

.uke-service-card h3,
.uke-service-card .custom h3 {
  margin: 0 0 .85rem;
  font-size: 1.35rem;
  line-height: 1.2;
  color: #111827;
}

.uke-service-card p,
.uke-service-card .custom p {
  color: #4b5563;
  margin: 0 0 1rem;
}

.uke-service-card ul,
.uke-service-card .custom ul {
  margin: 0;
  padding-left: 1.1rem;
  color: #374151;
}

.uke-service-card li,
.uke-service-card .custom li {
  margin: .28rem 0;
}

.uke-service-card strong,
.uke-service-card .custom strong {
  color: #111827;
}

/* hide old numeric icon if an older cached template rendered it */
.uke-service-icon {
  display: none !important;
}

@media (max-width: 1100px) {
  .uke-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .uke-services {
    padding: 2.5rem 0;
    margin-top: 2rem;
  }

  .uke-service-grid {
    grid-template-columns: 1fr;
  }

  .uke-service-card {
    min-height: auto;
    padding: 1.5rem;
  }
}


/* UKE BAU services as editable Joomla modules in one grid position */
.uke-services {
  background: #f8fafc;
  padding: 3.5rem 0;
  margin-top: 2.5rem;
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
}

.uke-section-header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 2.25rem;
}

.uke-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: stretch;
}

.uke-service-card {
  position: relative;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 1.35rem;
  padding: 1.75rem;
  background: #fff;
  box-shadow: 0 14px 35px rgba(17, 24, 39, .07);
  min-height: 260px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.uke-service-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: var(--primary);
}

.uke-service-card:hover {
  transform: translateY(-3px);
  border-color: rgba(210, 76, 67, .35);
  box-shadow: 0 20px 45px rgba(17, 24, 39, .11);
}

.uke-service-card h3,
.uke-service-card .uke-service-content h3,
.uke-service-card .custom h3 {
  margin: 0 0 .85rem;
  font-size: 1.35rem;
  line-height: 1.2;
  color: #111827;
}

.uke-service-card p,
.uke-service-card .custom p,
.uke-service-card .uke-service-content p {
  color: #4b5563;
  margin: 0 0 1rem;
}

.uke-service-card ul,
.uke-service-card .custom ul,
.uke-service-card .uke-service-content ul {
  margin: 0;
  padding-left: 1.1rem;
  color: #374151;
}

.uke-service-card li {
  margin: .28rem 0;
}

@media (max-width: 1100px) {
  .uke-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .uke-services {
    padding: 2.5rem 0;
    margin-top: 2rem;
  }

  .uke-service-grid {
    grid-template-columns: 1fr;
  }

  .uke-service-card {
    min-height: auto;
    padding: 1.5rem;
  }
}


/* v1.2.4: force Joomla service modules into real desktop cards */
.uke-services {
  background: #f8fafc !important;
  padding: 3.5rem 0 !important;
  margin-top: 2.5rem !important;
  border-top: 1px solid #e5e7eb !important;
  border-bottom: 1px solid #e5e7eb !important;
}

.uke-section-header {
  text-align: center !important;
  max-width: 760px !important;
  margin: 0 auto 2.25rem !important;
}

.uke-section-header h2 {
  font-size: clamp(1.75rem, 3vw, 2.35rem) !important;
  line-height: 1.15 !important;
  margin: 0 0 .85rem !important;
  color: #111827 !important;
}

.uke-section-header p {
  margin: 0 auto !important;
  color: #6b7280 !important;
  max-width: 680px !important;
}

.uke-service-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.5rem !important;
  align-items: stretch !important;
}

/* Joomla can output modules with different wrappers depending on chrome/module type */
.uke-service-grid > .moduletable,
.uke-service-grid > .module,
.uke-service-grid > .mod-custom,
.uke-service-grid > div {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 1.35rem !important;
  padding: 1.75rem !important;
  background: #fff !important;
  box-shadow: 0 14px 35px rgba(17, 24, 39, .07) !important;
  min-height: 260px !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.uke-service-grid > .moduletable::before,
.uke-service-grid > .module::before,
.uke-service-grid > .mod-custom::before,
.uke-service-grid > div::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  height: 5px !important;
  background: var(--primary) !important;
}

.uke-service-grid > .moduletable:hover,
.uke-service-grid > .module:hover,
.uke-service-grid > .mod-custom:hover,
.uke-service-grid > div:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(210, 76, 67, .35) !important;
  box-shadow: 0 20px 45px rgba(17, 24, 39, .11) !important;
}

.uke-service-grid h3,
.uke-service-grid h4 {
  margin: 0 0 .85rem !important;
  font-size: 1.35rem !important;
  line-height: 1.2 !important;
  color: #111827 !important;
}

.uke-service-grid p {
  color: #4b5563 !important;
  margin: 0 0 1rem !important;
}

.uke-service-grid ul {
  margin: 0 !important;
  padding-left: 1.1rem !important;
  color: #374151 !important;
}

.uke-service-grid li {
  margin: .28rem 0 !important;
}

.uke-service-grid strong {
  color: #111827 !important;
}

@media (max-width: 1100px) {
  .uke-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .uke-services {
    padding: 2.5rem 0 !important;
    margin-top: 2rem !important;
  }

  .uke-service-grid {
    grid-template-columns: 1fr !important;
  }

  .uke-service-grid > .moduletable,
  .uke-service-grid > .module,
  .uke-service-grid > .mod-custom,
  .uke-service-grid > div {
    min-height: auto !important;
    padding: 1.5rem !important;
  }
}


/* v1.2.5: Hero is editable via Joomla module position "hero" */
.hero .custom,
.hero .moduletable,
.hero .module,
.hero .hero-fallback {
  max-width: 820px;
}

.hero .custom h1,
.hero .moduletable h1,
.hero .module h1,
.hero .hero-fallback h1 {
  margin: 0 0 .75rem;
  font-size: clamp(2rem, 4vw, 3.15rem);
  line-height: 1.08;
  color: #fff;
}

.hero .custom p,
.hero .moduletable p,
.hero .module p,
.hero .hero-fallback p {
  margin: 0 0 1.25rem;
  max-width: 760px;
  color: rgba(255,255,255,.9);
  font-size: 1.05rem;
}

.hero .custom .btn,
.hero .moduletable .btn,
.hero .module .btn {
  display: inline-block;
  padding: .75rem 1rem;
  border-radius: .75rem;
  background: var(--primary);
  color: #fff;
  font-weight: 700;
}


/* v1.2.6: calmer hero typography + tighter homepage spacing */
.hero .custom h1,
.hero .moduletable h1,
.hero .module h1,
.hero .hero-fallback h1,
.hero h1 {
  font-size: clamp(1.75rem, 3vw, 2.55rem) !important;
  line-height: 1.12 !important;
  max-width: 860px;
}

.hero .custom p,
.hero .moduletable p,
.hero .module p,
.hero .hero-fallback p,
.hero p {
  font-size: 1rem !important;
  line-height: 1.65 !important;
  max-width: 780px;
}

.main-content {
  margin-top: 1.75rem !important;
  margin-bottom: 1.25rem !important;
}

.jdoc-content {
  min-height: 0 !important;
}

.uke-services {
  margin-top: 1.25rem !important;
}

.site-messages:empty,
.breadcrumb-area:empty,
.home-after-services:empty,
.bottom-area:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 700px) {
  .hero .custom h1,
  .hero .moduletable h1,
  .hero .module h1,
  .hero .hero-fallback h1,
  .hero h1 {
    font-size: 1.65rem !important;
  }

  .hero .custom p,
  .hero .moduletable p,
  .hero .module p,
  .hero .hero-fallback p,
  .hero p {
    font-size: .98rem !important;
  }

  .main-content {
    margin-top: 1.25rem !important;
    margin-bottom: 1rem !important;
  }
}


/* v1.2.7: Footer legal/navigation menu styling */
.footer .moduletable,
.footer .module,
.footer .mod-custom {
  margin-top: 1rem;
}

.footer ul,
.footer .mod-menu {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .9rem;
  flex-wrap: wrap;
}

.footer li {
  margin: 0;
  padding: 0;
}

.footer .mod-menu a,
.footer ul a {
  display: inline-block;
  color: #e5e7eb;
  font-size: .9rem;
  line-height: 1.2;
  padding: .25rem .35rem;
  border-radius: .35rem;
}

.footer .mod-menu a:hover,
.footer ul a:hover {
  color: #ffffff;
  background: rgba(255,255,255,.08);
  text-decoration: none;
}

.footer .mod-menu .active > a,
.footer ul .active > a {
  color: #ffffff;
  background: rgba(255,255,255,.1);
}

@media (max-width: 700px) {
  .footer ul,
  .footer .mod-menu {
    gap: .5rem;
  }

  .footer .mod-menu a,
  .footer ul a {
    font-size: .875rem;
  }
}


/* v1.2.9: Clickable logo home link */
.logo-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  border-radius: .75rem;
}

.logo-link:hover {
  text-decoration: none;
  opacity: .92;
}

.logo-link:focus-visible {
  outline: 3px solid rgba(210, 76, 67, .35);
  outline-offset: 4px;
}
