/* =====================================================================
   Artcubicle public site — "gallery wall" theme
   Palette: ink #12112B · adire #2A2377 · kola #E3A02F · hibiscus #C2335A
            teal #137A74 · wall #F6F6FB · paper #FFFFFF
   Signature: the adire pattern (CSS-only, no images)
   ===================================================================== */
:root {
  --ac-ink: #12112b;
  --ac-adire: #2a2377;
  --ac-adire-dark: #1c1757;
  --ac-kola: #e3a02f;
  --ac-hibiscus: #c2335a;
  --ac-teal: #137a74;
  --ac-wall: #f6f6fb;
  --ac-line: #e4e4ef;
  --ac-primary: var(--ac-adire);
  --ac-primary-dark: var(--ac-adire-dark);
  --ac-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --bs-primary: #2a2377;
  --bs-primary-rgb: 42, 35, 119;
  --bs-link-color: #2a2377;
  --bs-link-hover-color: #1c1757;
  --bs-link-color-rgb: 42, 35, 119;
  --bs-link-hover-color-rgb: 28, 23, 87;
}

body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background: var(--ac-wall); color: var(--ac-ink); }
a { text-decoration: none; }
h1, h2, h3, .ac-serif { font-family: var(--ac-serif); letter-spacing: -.01em; }
:focus-visible { outline: 3px solid var(--ac-kola); outline-offset: 2px; }

/* adire pattern: interlocking diamonds drawn with gradients */
.ac-adire {
  background-color: var(--ac-adire);
  background-image:
    linear-gradient(45deg, rgba(255,255,255,.07) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.07) 75%),
    linear-gradient(45deg, rgba(255,255,255,.07) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.07) 75%),
    radial-gradient(circle at 50% 50%, rgba(227,160,47,.28) 0 5px, transparent 6px);
  background-size: 44px 44px, 44px 44px, 44px 44px;
  background-position: 0 0, 22px 22px, 0 0;
}
.ac-adire-edge { height: 10px; background: repeating-linear-gradient(90deg, var(--ac-kola) 0 14px, var(--ac-adire) 14px 28px, var(--ac-hibiscus) 28px 42px, var(--ac-adire) 42px 56px); }

/* ---------- Announcement + header ---------- */
.ac-announce { background: var(--ac-ink); color: #f1eefb; font-size: .82rem; text-align: center; padding: .45rem 1rem; }
.ac-announce a { color: var(--ac-kola); }
.ac-header { background: #fff; border-bottom: 1px solid var(--ac-line); position: sticky; top: 0; z-index: 1030; }
.ac-brand { font-family: var(--ac-serif); font-weight: 700; font-size: 1.55rem; color: var(--ac-adire); letter-spacing: -.02em; }
.ac-brand i { color: var(--ac-kola); }
.ac-header .nav-link { color: var(--ac-ink); font-weight: 500; padding: 1.1rem .85rem; }
.ac-header .nav-link:hover, .ac-header .nav-item.show > .nav-link { color: var(--ac-adire); }
.ac-header .dropdown-toggle::after { vertical-align: .15em; }
.ac-search { max-width: 220px; }

/* mega menu */
@media (min-width: 992px) {
  .ac-header .navbar-nav > .nav-item.dropdown-mega { position: static; }
  .ac-header .navbar-nav > .nav-item:hover > .dropdown-menu { display: block; }
  .ac-header .dropdown-menu.mega { left: 0; right: 0; width: 100%; margin: 0; border: 0; border-top: 3px solid var(--ac-kola); border-radius: 0 0 1rem 1rem; box-shadow: 0 24px 48px rgba(18,17,43,.16); padding: 1.75rem 0; }
  .ac-header .dropdown-menu.simple { border: 0; border-top: 3px solid var(--ac-kola); border-radius: 0 0 .75rem .75rem; box-shadow: 0 16px 32px rgba(18,17,43,.14); min-width: 220px; }
}
.mega-link { display: flex; gap: .6rem; align-items: center; padding: .5rem .6rem; border-radius: .6rem; color: var(--ac-ink); }
.mega-link:hover { background: var(--ac-wall); color: var(--ac-adire); }
.mega-link .bi { color: var(--ac-kola); font-size: 1.1rem; }
.mega-link small { color: #6b6a85; }
.mega-feature { color: #fff; border-radius: 1rem; padding: 1.4rem; height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.mega-feature h3 { font-size: 1.25rem; }
@media (max-width: 991.98px) {
  .ac-header .nav-link { padding: .8rem 0; border-bottom: 1px solid var(--ac-line); }
  .ac-header .dropdown-menu { border: 0; padding: 0 0 0 .75rem; background: transparent; }
  .mega-feature { display: none; }
}

/* ---------- Buttons ---------- */
.btn-ac-primary { background: var(--ac-adire); border-color: var(--ac-adire); color: #fff; font-weight: 600; }
.btn-ac-primary:hover, .btn-ac-primary:focus { background: var(--ac-adire-dark); border-color: var(--ac-adire-dark); color: #fff; }
.btn-ac-kola { background: var(--ac-kola); border-color: var(--ac-kola); color: var(--ac-ink); font-weight: 600; }
.btn-ac-kola:hover { background: #cf8f20; border-color: #cf8f20; color: var(--ac-ink); }
.btn-ac-outline { border: 1.5px solid rgba(255,255,255,.7); color: #fff; font-weight: 600; }
.btn-ac-outline:hover { background: rgba(255,255,255,.14); color: #fff; }

/* ---------- Hero banners ---------- */
.ac-hero .carousel-item { min-height: clamp(420px, 62vh, 600px); }
.ac-hero .slide { min-height: inherit; display: flex; align-items: center; color: #fff; position: relative; overflow: hidden; background-size: cover; background-position: center; }
.ac-hero .slide::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18,17,43,.82) 0%, rgba(18,17,43,.45) 55%, rgba(18,17,43,.1) 100%); }
.ac-hero .slide.has-image::before { background: linear-gradient(90deg, rgba(18,17,43,.88), rgba(18,17,43,.35)); }
.ac-hero .slide .container { position: relative; z-index: 1; }
.ac-hero h1 { font-size: clamp(2rem, 5.2vw, 3.7rem); line-height: 1.05; max-width: 14em; font-weight: 700; }
.ac-hero p.lead { max-width: 34em; opacity: .92; }
.theme-indigo { background-color: var(--ac-adire); }
.theme-ochre { background-color: #8a5a07; }
.theme-hibiscus { background-color: #8e1f41; }
.theme-ink { background-color: var(--ac-ink); }
.theme-teal { background-color: var(--ac-teal); }
.slide.theme-indigo, .slide.theme-ochre, .slide.theme-hibiscus, .slide.theme-ink, .slide.theme-teal {
  background-image: linear-gradient(45deg, rgba(255,255,255,.06) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.06) 75%), linear-gradient(45deg, rgba(255,255,255,.06) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.06) 75%), radial-gradient(circle at 50% 50%, rgba(227,160,47,.3) 0 5px, transparent 6px);
  background-size: 52px 52px; background-position: 0 0, 26px 26px, 0 0;
}
.ac-hero .carousel-indicators { margin-bottom: 1.2rem; }
.ac-hero .carousel-indicators [data-bs-target] { width: 28px; height: 4px; border: 0; background: #fff; }
@media (prefers-reduced-motion: no-preference) { .ac-hero .slide .container { animation: acRise .7s ease both; } @keyframes acRise { from { opacity: 0; transform: translateY(14px);} to { opacity: 1; transform: none; } } }

/* ---------- Sections ---------- */
.ac-section { padding: 3.5rem 0; }
.ac-section-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.ac-section-head h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); margin: 0; }
.ac-stats { background: var(--ac-ink); color: #fff; }
.ac-stats .stat-value { font-family: var(--ac-serif); font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 700; color: var(--ac-kola); line-height: 1; }
.ac-stats .stat-label { color: #b8b5d6; font-size: .9rem; }

.ac-card-img { aspect-ratio: 4/5; object-fit: cover; width: 100%; border-radius: .35rem; background: #e9e9f3; }
.ac-card-img-square { aspect-ratio: 1/1; object-fit: cover; width: 100%; border-radius: .35rem; background: #e9e9f3; }
.ac-art { display: block; color: inherit; }
.ac-art .frame { background: #fff; padding: .6rem; border-radius: .4rem; box-shadow: 0 1px 2px rgba(18,17,43,.08); transition: box-shadow .2s ease; }
.ac-art:hover .frame { box-shadow: 0 10px 28px rgba(18,17,43,.18); }
.ac-art .title { font-family: var(--ac-serif); font-weight: 600; margin: .6rem 0 0; }
.ac-art .meta { color: #6b6a85; font-size: .85rem; }
.ac-art .price { font-weight: 700; color: var(--ac-adire); }

.ac-cat { display: block; border-radius: .9rem; padding: 1.1rem 1rem; color: #fff; min-height: 110px; position: relative; overflow: hidden; transition: transform .15s ease; }
.ac-cat:hover { transform: translateY(-3px); color: #fff; }
.ac-cat .name { font-family: var(--ac-serif); font-size: 1.1rem; font-weight: 700; display: block; }
.ac-cat .count { font-size: .8rem; opacity: .85; }
.ac-cat .bi { position: absolute; right: .6rem; bottom: .2rem; font-size: 3.2rem; opacity: .22; }

.ac-artist { text-align: center; color: inherit; display: block; }
.ac-artist .avatar { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; border: 4px solid #fff; box-shadow: 0 0 0 2px var(--ac-kola); background: #e9e9f3; }

.ac-exh { display: block; border-radius: 1rem; padding: 1.6rem; color: #fff; min-height: 190px; transition: transform .15s ease; }
.ac-exh:hover { transform: translateY(-3px); color: #fff; }

.ac-quote { background: #fff; border-radius: 1rem; padding: 1.4rem; height: 100%; border-left: 4px solid var(--ac-kola); }
.ac-quote p { font-family: var(--ac-serif); font-size: 1.05rem; }

.ac-cta { color: #fff; text-align: center; padding: 4rem 0; }
.ac-cta h2 { font-size: clamp(1.7rem, 4vw, 2.5rem); }

/* ---------- Footer ---------- */
.ac-footer { background: var(--ac-ink); color: #c9c7e0; margin-top: 0; }
.ac-footer a { color: #c9c7e0; }
.ac-footer a:hover { color: #fff; }
.ac-footer h6 { color: #fff; font-family: var(--ac-serif); font-size: 1.05rem; margin-bottom: .9rem; }
.ac-footer ul li { margin-bottom: .45rem; }
.ac-newsletter { background: var(--ac-adire); }
.ac-footer .social-icon { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.1); display: inline-flex; align-items: center; justify-content: center; color: #fff; margin-right: 6px; }
.ac-footer .social-icon:hover { background: var(--ac-kola); color: var(--ac-ink); }

/* generic */
.card { border-radius: .8rem; }
.form-control:focus, .form-select:focus { border-color: var(--ac-adire); box-shadow: 0 0 0 .2rem rgba(42,35,119,.15); }
.page-content { font-size: 1.05rem; line-height: 1.75; max-width: 70ch; }
.page-content h2, .page-content h3 { margin-top: 2rem; }
.page-content img { max-width: 100%; height: auto; border-radius: .5rem; }
.page-content table { width: 100%; margin: 1rem 0; }
.page-content th, .page-content td { border: 1px solid var(--ac-line); padding: .5rem .7rem; }
@media (max-width: 575.98px) { .ac-section { padding: 2.4rem 0; } }
@media (max-width: 767.98px) { .ac-hero .carousel-control-prev, .ac-hero .carousel-control-next { display: none; } }