.elementor-1943 .elementor-element.elementor-element-f19da3f{--display:flex;}/* Start custom CSS for html, class: .elementor-element-67cab90 */<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home — World Artists Institute</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400&family=Montserrat:wght@300;400;500;600&display=swap');

:root{
  --charcoal:#0B0B0B;
  --gold:#D4AF37;
  --ivory:#F8F6F1;
  --stone:#A7A39A;
  --sage:#55624E;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Montserrat',sans-serif;
  background:var(--ivory);
  color:var(--charcoal);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Playfair Display',serif;
  font-weight:500;
  line-height:1.15;
  letter-spacing:0.01em;
}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px;}
.rule{width:56px;height:2px;background:var(--gold);border:none;}
.rule.center{margin:0 auto;}

header{
  position:sticky;top:0;z-index:100;
  background:rgba(248,246,241,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(11,11,11,0.08);
}
.nav-inner{
  max-width:1120px;margin:0 auto;padding:18px 32px;
  display:flex;align-items:center;justify-content:space-between;
}
.logo-mark{display:flex;align-items:center;gap:12px;cursor:pointer;}
.logo-mark svg{width:38px;height:38px;}

nav.links{display:flex;gap:30px;align-items:center;}
nav.links a{font-size:12px;letter-spacing:0.08em;font-weight:500;color:var(--charcoal);position:relative;padding-bottom:4px;}
nav.links a:hover{color:var(--sage);}
nav.links a.current{color:var(--sage);border-bottom:1px solid var(--gold);}
.btn{
  display:inline-block;
  font-size:11px;letter-spacing:0.12em;font-weight:600;
  padding:12px 24px;
  border:1px solid var(--charcoal);
  color:var(--charcoal);
  transition:all .25s ease;
  white-space:nowrap;
  background:none;
  font-family:'Montserrat',sans-serif;
  cursor:pointer;
}
.btn:hover{background:var(--charcoal);color:var(--ivory);}
.btn.solid{background:var(--charcoal);color:var(--ivory);}
.btn.solid:hover{background:var(--sage);border-color:var(--sage);}
.menu-toggle{display:none;background:none;border:none;font-size:22px;cursor:pointer;color:var(--charcoal);}

@media(max-width:860px){
  nav.links{display:none;}
  .menu-toggle{display:block;}
  nav.links.open{
    display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;
    background:var(--ivory);padding:24px 32px;gap:18px;border-bottom:1px solid rgba(11,11,11,0.08);
  }
}

.hero{
  position:relative;min-height:88vh;display:flex;align-items:center;
  background:linear-gradient(180deg,var(--ivory) 0%,#F1EDE4 100%);
  overflow:hidden;
  padding:120px 0 80px;
}
.hero::before{
  content:"";position:absolute;right:-10%;top:-15%;width:60%;height:130%;
  background:radial-gradient(circle at 60% 40%, rgba(212,175,55,0.10), transparent 60%);
}
.hero-inner{position:relative;text-align:center;width:100%;}
.hero-tag{font-size:11px;letter-spacing:0.3em;color:var(--sage);font-weight:500;margin-bottom:22px;}
.hero h1{font-size:clamp(38px,6vw,68px);margin-bottom:20px;}
.hero .tagline{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(18px,2.4vw,24px);color:var(--sage);margin-bottom:26px;}
.hero p.lead{max-width:560px;margin:0 auto 40px;font-size:16px;color:#3a3a3a;}
.globe-hero{width:120px;height:120px;margin:0 auto 34px;opacity:0.9;}

section{padding:100px 0;}
section.tight{padding:80px 0;}
.eyebrow{font-size:11px;letter-spacing:0.24em;color:var(--sage);font-weight:600;margin-bottom:16px;}
.section-head{max-width:680px;margin-bottom:56px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head h2{font-size:clamp(28px,3.4vw,42px);margin-bottom:18px;}
.section-head p{color:#454545;font-size:16px;max-width:560px;}
.section-head.center p{margin-left:auto;margin-right:auto;}

.alt{background:#EFEBE1;}
.dark{background:var(--charcoal);color:var(--ivory);}
.dark .eyebrow{color:var(--gold);}
.dark p{color:#cfcdc6;}

.purpose-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(11,11,11,0.12);}
.purpose-item{padding:44px 36px;border-right:1px solid rgba(11,11,11,0.12);border-bottom:1px solid rgba(11,11,11,0.12);}
.purpose-item:last-child{border-right:none;}
.purpose-item h3{font-size:22px;margin-bottom:14px;color:var(--sage);}
.purpose-item p{font-size:14.5px;color:#444;}
@media(max-width:760px){
  .purpose-grid{grid-template-columns:1fr;}
  .purpose-item{border-right:none;}
}

.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
.split .visual{
  aspect-ratio:4/5;background:linear-gradient(160deg,#20241d,var(--sage));
  position:relative;overflow:hidden;
}
.split .visual .globe-big{position:absolute;inset:0;margin:auto;width:60%;height:60%;opacity:0.9;}
.split.reverse{direction:rtl;}
.split.reverse > *{direction:ltr;}
@media(max-width:860px){
  .split{grid-template-columns:1fr;}
  .split.reverse{direction:ltr;}
}

.cta-banner{
  background:var(--charcoal);color:var(--ivory);text-align:center;padding:110px 0;
  position:relative;overflow:hidden;
}
.cta-banner::before{
  content:"";position:absolute;left:50%;top:50%;width:900px;height:900px;transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(212,175,55,0.08), transparent 65%);
}
.cta-banner h2{font-size:clamp(28px,4vw,44px);margin-bottom:26px;position:relative;max-width:700px;margin-left:auto;margin-right:auto;}
.cta-banner .rule{margin:0 auto 26px;}

footer{background:var(--charcoal);color:var(--stone);padding:70px 0 30px;}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;padding-bottom:50px;border-bottom:1px solid rgba(248,246,241,0.12);}
.footer-brand p{max-width:280px;font-size:13.5px;margin-top:14px;}
.footer-brand .tag{font-family:'Playfair Display',serif;font-style:italic;color:var(--gold);margin-top:14px;font-size:14px;}
.footer-links{display:flex;gap:60px;flex-wrap:wrap;}
.footer-links a{display:block;font-size:13px;margin-bottom:12px;color:var(--stone);}
.footer-links a:hover{color:var(--ivory);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:26px;font-size:11.5px;flex-wrap:wrap;gap:12px;}
</style>
</head>
<body>
<header>
  <div class="nav-inner">
    <a class="logo-mark" href="index.html">
      <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
        <defs><clipPath id="globeclip"><circle cx="50" cy="52" r="19"/></clipPath></defs>
        <text x="2" y="72" font-family="Playfair Display, serif" font-size="60" font-weight="600" fill="#0B0B0B">W</text>
        <text x="34" y="72" font-family="Playfair Display, serif" font-size="60" font-weight="600" fill="#0B0B0B">A</text>
        <text x="70" y="72" font-family="Playfair Display, serif" font-size="60" font-weight="600" fill="#0B0B0B">I</text>
        <circle cx="50" cy="52" r="19" fill="#D4AF37" opacity="0.92"/>
        <g clip-path="url(#globeclip)" stroke="#0B0B0B" stroke-width="1" opacity="0.55" fill="none">
          <ellipse cx="50" cy="52" rx="19" ry="7"/><ellipse cx="50" cy="52" rx="19" ry="14"/>
          <line x1="31" y1="52" x2="69" y2="52"/><line x1="35" y1="42" x2="65" y2="42"/><line x1="35" y1="62" x2="65" y2="62"/>
        </g>
        <circle cx="50" cy="52" r="19" fill="none" stroke="#0B0B0B" stroke-width="1.4"/>
      </svg>
    </a>
    <nav class="links" id="navLinks">
      <a href="about.html">About Us</a>
      <a href="published-books.html">Published Books</a>
      <a href="press-media.html">Press &amp; Media</a>
      <a href="for-artists.html">For Artists</a>
      <a href="faq.html">FAQ</a>
      <a href="contact.html">Contact</a>
      <a href="for-artists.html" class="btn solid">Submit Your Work</a>
    </nav>
    <button class="menu-toggle" id="menuToggle">&#9776;</button>
  </div>
</header>

<section class="hero">
  <div class="wrap hero-inner">
    <svg class="globe-hero" viewBox="0 0 100 100">
      <circle cx="50" cy="50" r="42" fill="none" stroke="#D4AF37" stroke-width="1.2"/>
      <circle cx="50" cy="50" r="42" fill="#D4AF37" opacity="0.08"/>
      <g stroke="#0B0B0B" stroke-width="0.9" opacity="0.5" fill="none">
        <ellipse cx="50" cy="50" rx="42" ry="16"/><ellipse cx="50" cy="50" rx="42" ry="30"/>
        <line x1="8" y1="50" x2="92" y2="50"/><line x1="16" y1="28" x2="84" y2="28"/><line x1="16" y1="72" x2="84" y2="72"/>
      </g>
    </svg>
    <div class="hero-tag">WORLD ARTISTS INSTITUTE</div>
    <h1>Art knows no borders.</h1>
    <p class="tagline">Publishing and documenting contemporary artists worldwide.</p>
    <p class="lead">A global platform dedicated to preserving the practices and perspectives of contemporary artists, and connecting their work with the wider professional art world.</p>
    <a href="published-books.html" class="btn">Explore Our Publications</a>
  </div>
</section>

<section>
  <div class="wrap">
    <div class="section-head center">
      <div class="eyebrow">A Global Platform for Contemporary Art</div>
      <h2>Documenting the artists shaping contemporary art today</h2>
      <p>The World Artists Institute publishes and documents contemporary artists from around the world, creating lasting records of the artists and artistic practices shaping contemporary art today. Through curated publications and editorial projects, we present artists within an international art context and create opportunities for their work to reach a wider professional audience.</p>
    </div>
  </div>
</section>

<section class="tight alt">
  <div class="wrap">
    <div class="section-head">
      <div class="eyebrow">Our Purpose</div>
      <h2>Publish. Document. Connect.</h2>
    </div>
  </div>
  <div class="wrap" style="padding:0;">
    <div class="purpose-grid">
      <div class="purpose-item">
        <h3>Publish</h3>
        <p>We present selected contemporary artists through professionally produced publications created to preserve and share their work.</p>
      </div>
      <div class="purpose-item">
        <h3>Document</h3>
        <p>We create lasting documentation of artists, their practices, ideas, and contributions to contemporary art.</p>
      </div>
      <div class="purpose-item">
        <h3>Connect</h3>
        <p>We bring artists into a wider professional art context, connecting their published work with curators, critics, historians, galleries, museums, and cultural institutions.</p>
      </div>
    </div>
  </div>
</section>

<section>
  <div class="wrap split">
    <div>
      <div class="eyebrow">A Lasting Record</div>
      <h2 style="font-size:clamp(26px,3.2vw,36px);margin-bottom:20px;">Artists of today. Documented for tomorrow.</h2>
      <p style="color:#454545;margin-bottom:16px;">An artist's work deserves to exist beyond a single exhibition, project, or moment.</p>
      <p style="color:#454545;">Our publications create a tangible record of contemporary artistic practice, preserving artists' work and perspectives as part of the cultural record of our time.</p>
    </div>
    <div class="visual"><svg class="globe-big" viewBox="0 0 100 100">
      <circle cx="50" cy="50" r="42" fill="none" stroke="#D4AF37" stroke-width="1.2"/>
      <g stroke="#F8F6F1" stroke-width="0.8" opacity="0.55" fill="none">
        <ellipse cx="50" cy="50" rx="42" ry="16"/><ellipse cx="50" cy="50" rx="42" ry="30"/>
        <line x1="8" y1="50" x2="92" y2="50"/><line x1="16" y1="28" x2="84" y2="28"/><line x1="16" y1="72" x2="84" y2="72"/>
      </g>
    </svg></div>
  </div>
</section>

<section class="alt">
  <div class="wrap split reverse">
    <div class="visual"><svg class="globe-big" viewBox="0 0 100 100">
      <circle cx="50" cy="50" r="42" fill="none" stroke="#D4AF37" stroke-width="1.2"/>
      <g stroke="#F8F6F1" stroke-width="0.8" opacity="0.55" fill="none">
        <ellipse cx="50" cy="50" rx="42" ry="16"/><ellipse cx="50" cy="50" rx="42" ry="30"/>
        <line x1="8" y1="50" x2="92" y2="50"/><line x1="16" y1="28" x2="84" y2="28"/><line x1="16" y1="72" x2="84" y2="72"/>
      </g>
    </svg></div>
    <div>
      <div class="eyebrow">Publications</div>
      <h2 style="font-size:clamp(26px,3.2vw,36px);margin-bottom:20px;">Published by the World Artists Institute</h2>
      <p style="color:#454545;margin-bottom:16px;">Our books bring together contemporary artists from different countries, cultures, disciplines, and perspectives.</p>
      <p style="color:#454545;margin-bottom:28px;">Each publication presents selected artists through professionally produced editorial content, creating a lasting record of their artistic practice and placing their work within an international contemporary art context.</p>
      <a href="published-books.html" class="btn">View Published Books</a>
    </div>
  </div>
</section>

<section class="dark">
  <div class="wrap">
    <div class="section-head center">
      <div class="eyebrow">International Reach</div>
      <h2>From the page to the wider art world</h2>
      <p>Our publications are made available internationally through established distribution channels, giving participating artists a physical and digital record of their publication. Selected publications are available through Amazon and other distribution channels, with editions reaching readers in more than 20 countries.</p>
    </div>
    <div style="text-align:center;">
      <a href="published-books.html" class="btn" style="border-color:var(--gold);color:var(--ivory);">Discover Our Publications</a>
    </div>
  </div>
</section>

<section class="tight" style="text-align:center;">
  <div class="wrap">
    <div class="eyebrow" style="justify-content:center;display:flex;">A Place Within the Record</div>
    <h2 style="font-size:clamp(24px,3vw,32px);margin-bottom:16px;">Contemporary art is being made now.</h2>
    <p style="max-width:520px;margin:0 auto;color:#454545;">We believe that documenting it matters. By publishing artists and their work, the World Artists Institute contributes to a lasting record of contemporary artistic practice and the diverse voices shaping the art world today.</p>
  </div>
</section>

<div class="cta-banner">
  <div class="wrap">
    <div class="eyebrow" style="justify-content:center;display:flex;">Ready to Be Considered?</div>
    <h2>Submit your work for consideration in an upcoming World Artists Institute publication.</h2>
    <hr class="rule center">
    <a href="for-artists.html" class="btn solid" style="background:var(--gold);border-color:var(--gold);color:var(--charcoal);">Submit Your Work</a>
  </div>
</div>

<footer>
  <div class="wrap">
    <div class="footer-top">
      <div class="footer-brand">
        <svg width="34" height="34" viewBox="0 0 100 100">
          <text x="2" y="72" font-family="Playfair Display, serif" font-size="60" font-weight="600" fill="#F8F6F1">W</text>
          <text x="34" y="72" font-family="Playfair Display, serif" font-size="60" font-weight="600" fill="#F8F6F1">A</text>
          <text x="70" y="72" font-family="Playfair Display, serif" font-size="60" font-weight="600" fill="#F8F6F1">I</text>
          <circle cx="50" cy="52" r="19" fill="#D4AF37" opacity="0.92"/>
        </svg>
        <p>World Artists Institute — Publishing and documenting contemporary artists worldwide.</p>
        <div class="tag">Art knows no borders.</div>
      </div>
      <div class="footer-links">
        <div>
          <a href="index.html">Home</a>
          <a href="about.html">About Us</a>
          <a href="published-books.html">Published Books</a>
        </div>
        <div>
          <a href="press-media.html">Press &amp; Media</a>
          <a href="for-artists.html">For Artists</a>
          <a href="faq.html">FAQ</a>
        </div>
        <div>
          <a href="contact.html">Contact</a>
          <a href="for-artists.html">Submit Your Work</a>
        </div>
      </div>
    </div>
    <div class="footer-bottom">
      <span>© 2026 World Artists Institute. All rights reserved.</span>
      <span>Art People Stories — A Global Perspective</span>
    </div>
  </div>
</footer>
<script>
  document.getElementById('menuToggle').addEventListener('click', function(){
    document.getElementById('navLinks').classList.toggle('open');
  });
  document.querySelectorAll('nav.links a').forEach(function(a){
    a.addEventListener('click', function(){ document.getElementById('navLinks').classList.remove('open'); });
  });
</script>
</body>
</html>/* End custom CSS */