/*
Theme Name: Arton Grey Exact Links
Theme URI: https://artongrey.com/
Author: MADFEX / Arton Grey
Description: Exact Arton Grey homepage based on the approved reference. Only header and links are editable.
Version: 14.0.0
Text Domain: arton-grey
*/
:root{
  --bg:#050505;
  --gold:#c89543;
  --gold2:#e0ad58;
  --line:rgba(200,149,67,.55);
  --text:#f6f0e7;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}
body{overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{display:block;width:100%}
.ag-site{min-height:100vh;background:var(--bg)}
.ag-wrap{width:min(940px,calc(100% - 34px));margin:0 auto}

.ag-hero{
  width:100%;
  aspect-ratio:1983/660;
  background-image:var(--desktop);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.ag-section{padding:28px 0 18px}
.ag-section-tight{padding-top:16px}
.ag-heading{
  margin:0 0 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  color:var(--gold2);
  font-size:18px;
  font-weight:700;
  letter-spacing:6px;
  text-transform:uppercase;
}
.ag-heading:before,.ag-heading:after{
  content:"";
  height:1px;
  flex:1;
  background:linear-gradient(90deg,transparent,var(--line));
}
.ag-heading:after{background:linear-gradient(90deg,var(--line),transparent)}

.ag-listen-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:14px;
}
.ag-listen-card{
  display:block;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 14px 36px rgba(0,0,0,.36);
  transition:transform .18s ease;
}
.ag-listen-card img{aspect-ratio:145/175;object-fit:cover}
.ag-listen-card:hover{transform:translateY(-3px)}

.ag-social-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.ag-social-card{
  display:block;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 14px 36px rgba(0,0,0,.34);
  transition:transform .18s ease;
}
.ag-social-card img{aspect-ratio:2.15/1;object-fit:cover}
.ag-social-card:hover{transform:translateY(-3px)}

.ag-world-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.ag-world-card{
  display:block;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(200,149,67,.35);
  box-shadow:0 16px 38px rgba(0,0,0,.34);
  transition:transform .18s ease;
}
.ag-world-card img{aspect-ratio:302/204;object-fit:cover}
.ag-world-card:hover{transform:translateY(-3px)}

.ag-footer{text-align:center;padding:14px 20px 48px}
.ag-quote{
  color:var(--gold2);
  font-family:"Brush Script MT","Segoe Script",cursive;
  font-size:38px;
  line-height:1.18;
}
.ag-starline{
  width:min(310px,80%);
  margin:18px auto 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:var(--gold2);
}
.ag-starline span{height:1px;flex:1;background:var(--line)}
.ag-domain{font-family:Georgia,serif;letter-spacing:6px;font-size:14px}

@media(max-width:900px){
  .ag-hero{aspect-ratio:16/9;background-image:var(--mobile)}
  .ag-listen-grid{grid-template-columns:repeat(3,1fr)}
  .ag-social-grid{grid-template-columns:repeat(2,1fr)}
  .ag-world-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .ag-wrap{width:min(100% - 24px,940px)}
  .ag-hero{aspect-ratio:4/3}
  .ag-listen-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .ag-social-grid{grid-template-columns:1fr;gap:10px}
  .ag-heading{font-size:14px;letter-spacing:4px;gap:10px}
  .ag-quote{font-size:32px}
}