/* Mobile-first responsive stylesheet for ARTAC single page */
:root{
  --bg:#ffffff;
  --text:#1f2933;
  --muted:#6b7280;
  --brand:#0a4fb5; /* refined brand blue */
  --container:1100px;
  --radius:6px;
  --header-height:61px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial; color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:1rem;top:1rem;width:auto;height:auto;padding:0.5rem 0.75rem;background:#fff;border-radius:6px;box-shadow:0 6px 18px rgba(10,79,181,0.12);z-index:2000}
.container{max-width:var(--container);margin:0 auto;padding:1rem}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:0.25rem 0}
.logo img{height:36px}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.byline{font-size:0.78rem;color:var(--muted);font-weight:300;letter-spacing:0.02em;font-family:'Jost',sans-serif;line-height:1}
.site-header{background:rgba(255,255,255,0.95);border-bottom:1px solid #eee;position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--header-height);}
.nav-toggle{display:inline-block;background:none;border:1px solid #ddd;padding:0.4rem 0.6rem;border-radius:4px}
.header-inner{height:var(--header-height)}
.main-nav{display:none}
.main-nav a{display:block;padding:0.35rem 0;color:var(--text);text-decoration:none}
.hero{position:relative;overflow:hidden;padding:0;min-height:260px;background:linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);text-align:center}
.hero-image{position:absolute;top:0;left:0;right:0;bottom:0;height:260px;overflow:hidden;width:100%;z-index:1}
.hero-image img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.02) saturate(0.98)}
.hero-content{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:10;padding:2rem 0;text-align:center}
.hero h1{font-family:'Jost',sans-serif;font-weight:900;font-size:2.25rem;margin:0 0 0.5rem;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,0.35)}
.lead{font-size:1.05rem;color:#eef6ff;margin-bottom:1rem}
.hero .btn.primary{background:#EC7D31;color:#fff;box-shadow:0 6px 18px rgba(236,125,49,0.18);border:0}
.hero .btn.primary:hover,.hero .btn.primary:focus{background:#d36a23}
.hero .btn.primary:focus{outline:3px solid rgba(236,125,49,0.18);outline-offset:3px}
.btn{display:inline-block;padding:0.6rem 1rem;border-radius:6px;text-decoration:none}
.btn.primary{background:var(--brand);color:#fff}
.section{padding:2rem 0;border-top:1px solid #f1f5f9}
.section h2{font-family:'Jost',sans-serif;margin-top:0}

/* Prevent fixed header from covering anchored section headings */
section[id]{
  scroll-margin-top: calc(var(--header-height) + 0.75rem);
}
.services-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.service-card{background:#fff;padding:1rem;border-radius:8px;display:flex;gap:1rem;align-items:center;text-align:center;flex-direction:column}
.service-icon{width:64px;height:64px;object-fit:contain}
.service-card h3{margin:0 0 0.25rem;font-weight:700}
.service-card p{margin:0;color:var(--muted);font-weight:500}
.about ul, .partner-topics{list-style:disc;margin-left:0}

/* Center main content: headings and text */
main{text-align:center}
main .container{display:block}
/* ensure main content doesn't hide under fixed header */
body{padding-top:var(--header-height)}
/* Keep lists readable but centered as blocks */
.about ul, .partner-topics{display:inline-block;text-align:left}

/* About grid: first row 3 columns, second row 2 columns */
.about-grid{display:block;margin:1rem auto;max-width:980px}
.about-row{display:grid;gap:1rem;margin-bottom:0.75rem}
.about-row-3{grid-template-columns:1fr}
.about-row-2{grid-template-columns:1fr}
.about-item{background:#fff;padding:1rem;border-radius:8px;font-weight:600}

/* Contact section layout: two columns on wide, stacked on narrow */
.contact-grid{display:block;margin:1rem 0;gap:1rem}
.contact-left,.contact-right{background:transparent;padding:0;margin-bottom:1rem;text-align:center}
.contact-left address{font-weight:600;margin-bottom:0.5rem}
.contact-right li {list-style: none; margin-left: 0;}
.bank-info{background:#fff;padding:1rem;border-radius:8px;margin-top:1rem;border:none}


@media(min-width:768px){
  .about-row-3{grid-template-columns:repeat(3,1fr)}
  .about-row-2{grid-template-columns:repeat(2,1fr);justify-content:center}
  .about-grid{margin-left:auto;margin-right:auto}
}

.partners-grid{display:none}
.partner-topics{margin-bottom:1rem}
.site-footer{padding:1rem 0;background:#fafafa;border-top:1px solid #eee;margin-top:2rem}
.footer-nav a{margin-right:1rem;color:var(--muted);text-decoration:none}

/* Partner groups */
.partner-group{margin:1.25rem 0}
.partner-group-title{font-family:'Jost',sans-serif;margin:3.125rem 0 0.6rem;font-weight:700}
.partner-logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:0.75rem;align-items:center;max-width:960px;margin:0 auto;justify-content:center}
.partner-logos img{justify-self:center;max-width:100%;width:auto;max-height:64px;object-fit:contain;padding:6px;border-radius:6px;filter:grayscale(100%) contrast(0.95) opacity(0.95);transition:filter .22s ease,transform .18s ease;transform-origin:center center}
.partner-logos img:hover,.partner-logos img:focus{filter:grayscale(0%) contrast(1) opacity(1);transform:scale(1.06)}
.partner-logos img:focus{outline:3px solid rgba(10,79,181,0.12);outline-offset:6px}

@media(min-width:768px){
  .partner-logos{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
}

/* Section separators (heading images between sections) */
.section-sep{width:100%;overflow:hidden;margin:0}
.section-sep img{width:100%;height:140px;object-fit:cover;display:block;filter:brightness(0.96) saturate(0.96)}


/* Medium and up */
@media(min-width:768px){
  .nav-toggle{display:none}
  .main-nav{display:flex;gap:1rem;align-items:center}
  .main-nav a{display:inline-block}
  .hero{min-height:380px}
  .hero-image{height:380px}
  .section-sep img{height:200px}
  .hero-content{top:52%}
  .hero h1{font-size:3.25rem; font-weight: 600}
  .services-grid{grid-template-columns:repeat(3,1fr)}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:2.5rem}
  /* Right-align left column on wider screens for visual balance */
  .contact-left{ text-align:right }
  .contact-left address{margin-right:0}
  .contact-right{ text-align:left }
  .contact-right li {list-style: disc ;}
  .project-support-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-top:1rem}
  .support-heading{margin-top:1.5rem;margin-bottom:0.6rem}
  .support-item{background:#fff;padding:1rem;border-radius:8px;text-align:center;font-weight:600}
  .project-support-grid{grid-template-columns:repeat(3,1fr)}
  .partners-grid{grid-template-columns:repeat(6,1fr);gap:1rem}
}

/* Container spacing */
.container{padding-left:1.25rem;padding-right:1.25rem}

/* Accessibility: use focus-visible so keyboard users see outlines, mouse clicks don't leave persistent borders */
a:focus-visible{outline:3px solid #bcd7ff;outline-offset:2px}
/* hide outline for navigation/footer links when focus is not focus-visible (i.e. mouse click) */
.main-nav a:focus:not(:focus-visible), .footer-nav a:focus:not(:focus-visible) { outline: none; }

/* Back to top button */
.back-to-top{position:fixed;right:1.25rem;bottom:1.25rem;width:44px;height:44px;border-radius:22px;background:#EC7D31;color:#fff;border:0;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(236,125,49,0.18);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease,visibility .18s}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top:focus{outline:3px solid #bcd7ff}
.back-to-top:hover,.back-to-top:focus{background:#d36a23}

/* Make the arrow glyph stronger: larger and bolder */
.back-to-top{font-size:20px;font-weight:700;line-height:1}