/*
Theme Name: Simple Five
Theme URI: https://example.com/simple-five
Author: ChatGPT
Description: A clean 5-page starter theme with a logo, top nav, home sections, image carousel, and a footer with contact and business hours areas.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: simple-five
*/
:root{
  --bg:#ffffff;
  --card:#005D6C;
  --text:#0f0f0f;
  --muted:#b7bbc7;
  --accent:#005D9B;
  --accent-2:#005D9B;
  --border:#005D6C;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans',sans-serif;line-height:1.6}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
/* Container */
.site-header { position:sticky; top:0; background:#ffffff; border-bottom:1px solid #005D6C; z-index:100; }
.nav-container { max-width:1100px; margin:0 auto; padding:0 16px; height:200px; display:flex; align-items:center; justify-content:space-between; }

/* Brand */
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; }
.brand-logo { height:160px; width:auto; display:block; }
.brand-title { color:#e8e8e8; font-weight:700; letter-spacing:.2px; }

/* Menu desktop */
.menu-wrap { display:flex; }
.menu { list-style:none; display:flex; gap:18px; margin:0; padding:0; }
.menu a { color:#000000; text-decoration:none; padding:8px 10px; border-radius:10px; display:block; }
.menu a:hover { background:#005D6C; color: #ffffff }

/* Hamburger */
.nav-toggle{
  display:none; position:relative; width:42px; height:36px; border: none;
  background:transparent; cursor:pointer;
}
.nav-toggle .bar{ position:absolute; left:9px; right:9px; height:2px; background:#e8e8e8; transition:transform .25s, opacity .2s, top .25s; }
.nav-toggle .bar:nth-child(1){ top:11px; background: #000000;}
.nav-toggle .bar:nth-child(2){ top:17px; background: #000000;}
.nav-toggle .bar:nth-child(3){ top:23px; background: #000000;}
.nav-toggle[aria-expanded="true"] .bar:nth-child(1){ top:17px; transform:rotate(45deg); }
.nav-toggle[aria-expanded="true"] .bar:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .bar:nth-child(3){ top:17px; transform:rotate(-45deg); }

/* Mobile behavior */
@media (max-width: 800px){
  .nav-toggle{ display:block; }
  .menu-wrap{
    position:absolute; left:0; right:0; top:180px;
    background:#0d0f15;
    display:block; max-height:0; overflow:hidden; transition:max-height .3s ease;
  }
  .menu-wrap.open{ max-height:60vh; background: #ffffff;}
  .menu{ flex-direction:column; gap:6px; padding:10px 12px; }
  .menu a{ width:100%; }
}

.hero{padding:54px 0;border-bottom:1px solid var(--border)}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
@media(max-width:900px){.grid-2{grid-template-columns:1fr;gap:20px}}
.card{background:linear-gradient(180deg,#005D6C, #005D6C);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:0 6px 20px #005D6C;}
.card h1{margin:0 0 10px;font-size:32px;color:#ffffff;}
.card p{color:#ffffff;margin:0 0 20px}
.btn{display:inline-block;background:#ffffff;color:#000000;font-weight:700;padding:10px 14px;border-radius:12px;border:0}
.btn:hover{opacity:.95}
.hero-image{display:flex;align-items:center;justify-content:center;height:320px;}
.hero-image img{max-height:100%;max-width:100%;object-fit:contain;border-radius: 25px;}

/* --- Three images layout --- */
.three-images-layout h1 {
  text-align: center;
  margin-bottom: 30px;
}

.three-images {
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
}

.three-images .image-box {
  flex: 1 1 30%; /* 3 images across */
  max-width: 30%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.three-images .image-box img {
  width: 75%;
  height: auto;
  object-fit: cover;
}

/* Responsive: stack on mobile */
@media(max-width: 800px){
  .three-images .image-box {
    max-width: 100%;
    flex: 1 1 100%;
  }
}

/* Footer */
footer.site-footer{border-top:1px solid var(--border);background:#005D6C}
.footer-inner{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:26px 26px}
.footer-left .footer-title{color:#ffffff;font-weight:800;margin:0 0 6px}
.footer-left address{font-style:normal;color:#ffffff;white-space:pre-line}
.footer-right{text-align:right;color:#ffffff}
.smallprint{border-top:1px solid var(--border);color:#ffffff;padding:12px 12px;font-size:12px;opacity:.9}
/* Content pages */
.page-wrap{padding:40px 0}
.page-wrap h1{margin-top:0}
/* Utility */
.hidden{display:none}

