/* Applied Attention house site. Brand kit F7 Sharp/Metal:
   Ink #111111, Charcoal #292925, Ivory #F5F3ED, White #FFFFFF. */
:root{
  --ink:#111111; --char:#292925; --ivory:#F5F3ED; --white:#FFFFFF;
  --mute-ivory:#787266; --mute-dark:#a8a092; --gold:#8c6a32; --gold-soft:#d8b780;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--ink);color:var(--ivory);font-family:"Liberation Sans","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;}
img{display:block;max-width:100%;}
a{color:inherit;}
.wrap{max-width:1460px;margin:0 auto;padding:0 48px;}
h2.tracked{font-size:30px;letter-spacing:.28em;font-weight:700;text-transform:uppercase;}
.sub{margin-top:14px;font-size:20px;line-height:1.45;}
section{padding:72px 0 84px;}

/* NAV */
nav{position:sticky;top:0;z-index:50;background:var(--char);border-bottom:1px solid #3a3a34;}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:84px;}
.nav-in img{height:52px;width:auto;}
.nav-links{display:flex;gap:34px;}
.nav-links a{text-decoration:none;font-size:16px;letter-spacing:.3em;color:var(--ivory);text-transform:uppercase;}
.nav-links a:hover{color:var(--gold-soft);}

/* HERO */
.hero img{width:100%;height:auto;}
.motto{background:var(--ink);text-align:center;padding:24px 16px;}
.motto span{font-size:clamp(17px,2.4vw,25px);letter-spacing:.55em;text-transform:uppercase;color:var(--ivory);}

/* SHOP THE HOUSE (ivory) */
.shop{background:var(--ivory);color:var(--char);}
.shop .sub{color:var(--mute-ivory);}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px;}
.card img,.card .card-art{width:100%;height:320px;object-fit:cover;}
.card .card-art{background:var(--char);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:24px;text-align:center;}
.card .card-art img{height:110px;width:auto;object-fit:contain;}
.card .card-art p{color:var(--ivory);font-weight:700;letter-spacing:.22em;font-size:17px;line-height:1.7;text-transform:uppercase;}
.card h3{margin-top:24px;font-size:25px;letter-spacing:.06em;text-transform:uppercase;}
.card .desc{margin-top:8px;font-size:18px;color:var(--mute-ivory);line-height:1.45;}
.card .price{margin-top:8px;font-size:18px;font-weight:700;color:var(--gold);}

/* STORE (charcoal) */
.store{background:var(--char);}
.store .sub{color:var(--mute-dark);}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px;}
.tile img,.tile .tile-art{width:100%;height:380px;object-fit:cover;background:#0a0a0a;}
.tile .tile-art{background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:24px;text-align:center;}
.tile .tile-art img{height:96px;width:auto;object-fit:contain;background:none;}
.tile .tile-art p{color:var(--mute-dark);letter-spacing:.24em;font-size:15px;text-transform:uppercase;line-height:1.7;}
.tile h3{margin-top:18px;font-size:21px;color:var(--ivory);}
.tile .tprice{margin-top:6px;font-size:18px;color:var(--gold-soft);}
.tile .tprice s{color:var(--mute-dark);font-weight:400;}
.tile .soon{display:inline-block;margin-top:10px;font-size:14px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute-dark);border:1px solid #4a4a42;padding:7px 12px;}
.buyrow{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap;}
.buyrow a{text-decoration:none;font-size:15px;letter-spacing:.14em;text-transform:uppercase;padding:11px 16px;border:1px solid var(--gold-soft);color:var(--gold-soft);}
.buyrow a.primary{background:var(--gold-soft);color:var(--ink);font-weight:700;border-color:var(--gold-soft);}
.buyrow a:hover{opacity:.85;}

/* ARCHIVAL (ink) */
.archival{background:var(--ink);}
.archival .sub{color:var(--mute-dark);}
.collection{margin-top:52px;}
.collection h3{font-size:22px;letter-spacing:.24em;text-transform:uppercase;color:var(--ivory);}
.collection .quote{margin-top:8px;font-size:19px;font-style:italic;color:var(--mute-dark);}
.boards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:24px;}
.boards figure img{width:100%;height:250px;object-fit:cover;}
.boards figcaption{margin-top:10px;font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-dark);text-align:center;}

/* FOOTER */
footer{background:var(--char);padding:64px 0 54px;text-align:center;}
footer .lockup{height:120px;width:auto;margin:0 auto;}
footer .ties{margin-top:34px;font-size:16px;letter-spacing:.3em;color:var(--mute-dark);text-transform:uppercase;line-height:2;}
footer .ties a{text-decoration:none;}
footer .ties a:hover{color:var(--gold-soft);}
footer .fine{margin-top:16px;font-size:16px;letter-spacing:.3em;color:var(--mute-dark);text-transform:uppercase;}

@media (max-width:1000px){
  .cards,.tiles{grid-template-columns:1fr 1fr;}
  .boards{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  .wrap{padding:0 20px;}
  .cards,.tiles,.boards{grid-template-columns:1fr;}
  .nav-links{display:none;}
  section{padding:52px 0 60px;}
  footer .lockup{height:88px;}
}
