/* =========================================================
AA TEGUH MAIN CSS
Load order penting supaya layout stabil
========================================================= */

/* DESIGN SYSTEM */
@import url("./tokens.css");

/* BASE RESET */
@import url("./base.css");

/* LAYOUT STRUCTURE */
@import url("./layout.css");

/* UI COMPONENTS */
@import url("./components.css");

/* UTILITIES */
@import url("./utilities.css");

/* PAGE SPECIFIC */
@import url("./about.css");
@import url("./career.css");


/* =========================================================
GLOBAL SAFETY FIX
Elak layout overflow & bug scroll
========================================================= */

html,body{
width:100%;
overflow-x:hidden;
}

/* container safety */
.aa-container{
width:min(92%,var(--container));
margin-inline:auto;
}

/* image safe */
img{
max-width:100%;
height:auto;
display:block;
}

/* section safe */
section,header,footer,main{
width:100%;
max-width:100%;
}


/* =========================================================
HEADER BASIC FIX
========================================================= */

.aa-header{
position:sticky;
top:0;
z-index:1000;
background:var(--surface);
border-bottom:1px solid var(--line);
}

.aa-header__inner{
display:flex;
align-items:center;
justify-content:space-between;
padding:12px 0;
}


/* =========================================================
NAVIGATION FIX
========================================================= */

.aa-nav{
display:flex;
justify-content:center;
flex:1;
}

.aa-menu{
display:flex;
gap:14px;
list-style:none;
margin:0;
padding:0;
}

.aa-menu a{
padding:8px 12px;
border-radius:12px;
font-weight:700;
color:var(--muted);
transition:.2s;
}

.aa-menu a:hover{
background:rgba(37,99,235,.08);
color:var(--text);
}


/* =========================================================
HERO STRUCTURE
========================================================= */

.aa-hero{
padding:70px 0;
background:
radial-gradient(900px 420px at 18% -10%,rgba(37,99,235,.15),transparent 60%),
radial-gradient(900px 420px at 88% 0%,rgba(249,115,22,.15),transparent 60%),
linear-gradient(180deg,var(--bg),var(--surface-2));
}

.aa-hero__grid{
display:grid;
grid-template-columns:1.1fr .9fr;
gap:28px;
align-items:center;
}

@media(max-width:980px){

.aa-hero__grid{
grid-template-columns:1fr;
}

}


/* =========================================================
CARDS GRID
========================================================= */

.aa-cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
}

@media(max-width:980px){
.aa-cards{
grid-template-columns:repeat(2,1fr);
}
}

@media(max-width:640px){
.aa-cards{
grid-template-columns:1fr;
}
}

/* HERO GRID */
.aa-company-hero__grid{
  display:grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap:40px;
}

@media(max-width:768px){
  .aa-company-hero__grid{
    grid-template-columns:1fr;
  }
}

/* HERO CONTENT */
.aa-company-hero__actions{
  display:flex;
  gap:12px;
  margin-top:16px;
}

.aa-company-hero__meta{
  margin-top:16px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* CARD RIGHT */
.aa-company-hero__card{
  background: rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  padding:20px;
}

/* LOGO */
.aa-company-logo img{
  width:100%;
  border-radius:12px;
}

/* ADDRESS */
.aa-company-address{
  margin-top:16px;
}

.aa-label{
  font-size:12px;
  text-transform:uppercase;
  opacity:.6;
  margin-bottom:4px;
}

/* CONTENT */
.aa-content{
  line-height:1.8;
  opacity:.9;
}

/* GRID OUTLET */
.aa-branches-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:20px;
}

/* CARD OUTLET */
.aa-branch-card{
  background:#fff;
  border-radius:14px;
  padding:18px;
  border:1px solid #eee;
  transition:.2s;
}

.aa-branch-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(0,0,0,0.06);
}

.aa-branch-card__meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:10px 0;
}

/* BUTTON FULL */
.aa-btn--block{
  width:100%;
  margin-top:16px;
}
/* =========================================================
FOOTER BASIC FIX
========================================================= */

.aa-footer{
margin-top:40px;
background:var(--surface);
border-top:1px solid var(--line);
}

.aa-footer__grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
padding:30px 0;
}

.aa-footer__bottom{
border-top:1px solid var(--line);
padding:16px 0;
font-size:.9rem;
color:var(--muted);
display:flex;
justify-content:space-between;
align-items:center;
}

@media(max-width:780px){

.aa-footer__bottom{
flex-direction:column;
gap:10px;
text-align:center;
}

}