/*
Theme Name: Aesthetic Arches
Theme URI: https://aestheticarches.com
Author: Aesthetic Arches Design
Description: Modern Neo-Deco & Small-Space Styling theme built for AestheticArches.com. Includes specific layout requirements for Pinterest optimization and display ads.
Version: 1.4 (Mobile Optimization Fix)
Text Domain: aestheticarches
*/

:root{
  --cream:#F6EFE3; --blush:#F1DED4; --emerald:#1E4438; --emerald-deep:#15332A;
  --terracotta:#C15F3C; --brass:#AE8A4E; --charcoal:#2A2622; --charcoal-soft:#57504A;
  --line:rgba(42,38,34,0.14); --max:1180px;
}

*{box-sizing:border-box;} html{scroll-behavior:smooth;}
body{ margin:0; background:var(--cream); color:var(--charcoal); font-family:'Archivo', sans-serif; font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased; }
h1,h2,h3{ font-family:'Fraunces', serif; font-weight:450; color:var(--charcoal); margin:0; letter-spacing:-0.01em; }
a{color:inherit; text-decoration:none;} img,svg{display:block; max-width:100%;}
.wrap{max-width:var(--max); margin:0 auto; padding-left:32px; padding-right:32px;}
button{font-family:inherit; cursor:pointer;}
:focus-visible{outline:2px solid var(--emerald); outline-offset:3px;}

.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); border:0; }
.ad-placeholder { background:rgba(42,38,34,0.05); border:1px dashed var(--line); text-align:center; padding:20px; margin:30px 0; font-size:0.8rem; color:var(--charcoal-soft); }

@media (prefers-reduced-motion: reduce){ *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;} }

/* Header */
header{ position:sticky; top:0; z-index:40; background:rgba(246,239,227,0.92); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
.nav{ display:flex; align-items:center; justify-content:space-between; padding:20px 32px; max-width:var(--max); margin:0 auto; }
.brand{ display:flex; align-items:center; gap:10px; font-family:'Fraunces', serif; font-size:1.28rem; color:var(--charcoal); }
.brand-mark{width:26px; height:26px; flex:none;}
.nav-links{display:flex; gap:34px; list-style:none; margin:0; padding:0;}
.nav-links a{ font-size:0.94rem; color:var(--charcoal-soft); position:relative; padding-bottom:3px; }
.nav-links a:hover{color:var(--terracotta);}
.nav-cta{ background:var(--emerald); color:var(--cream); padding:11px 22px; border-radius:3px; font-size:0.9rem; border:1px solid var(--emerald); transition:background .2s ease; }
.nav-cta:hover{background:var(--emerald-deep);}
.nav-toggle{display:none;}

/* Hero */
.hero{ position:relative; padding:96px 32px 0; overflow:hidden; }
.hero-inner{ max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; }
.eyebrow-tag{ display:inline-flex; align-items:center; gap:10px; font-size:0.82rem; color:var(--terracotta); margin-bottom:22px; font-family:'Archivo', sans-serif; font-weight:500; }
.eyebrow-tag::before{ content:""; width:22px; height:1px; background:var(--terracotta); }
.hero h1{ font-size:clamp(2.4rem, 4.6vw, 3.6rem); line-height:1.06; max-width:15ch; }
.hero h1 em{ font-style:italic; color:var(--emerald); }
.hero p{ margin-top:24px; max-width:46ch; color:var(--charcoal-soft); font-size:1.08rem; }
.hero-actions{margin-top:36px; display:flex; gap:16px; flex-wrap:wrap;}
.btn-primary{ background:var(--emerald); color:var(--cream); padding:15px 30px; border-radius:3px; font-size:0.95rem; font-weight:500; display:inline-block; transition:background .2s ease; }
.btn-primary:hover{background:var(--emerald-deep);}
.btn-ghost{ padding:15px 6px; border-bottom:1px solid var(--charcoal); font-size:0.95rem; font-weight:500; }
.btn-ghost:hover{border-color:var(--terracotta); color:var(--terracotta);}
.hero-art{ position:relative; aspect-ratio:4/5; background:linear-gradient(155deg, var(--blush) 0%, #E7CFC0 55%, #DCC0A9 100%); border-radius:220px 220px 6px 6px; overflow:hidden; }
.hero-art .band{ position:absolute; inset:0; background: radial-gradient(circle at 50% 112%, transparent 0 34%, rgba(30,68,56,0.14) 34% 36%, transparent 36% 100%), radial-gradient(circle at 50% 132%, transparent 0 44%, rgba(174,138,78,0.5) 44% 45.4%, transparent 45.4% 100%); }
.hero-art .arch-frame{ position:absolute; left:14%; right:14%; bottom:9%; top:16%; border:1px solid rgba(42,38,34,0.28); border-radius:999px 999px 0 0; }
.hero-art .cap{ position:absolute; bottom:9%; left:14%; right:14%; font-family:'Fraunces', serif; font-style:italic; font-size:0.95rem; color:var(--emerald-deep); text-align:center; padding-bottom:14px; }

/* Strip */
.strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-top:88px; padding:18px 0; overflow:hidden; background:var(--blush); }
.strip-track{ display:flex; gap:52px; white-space:nowrap; animation:scroll 26s linear infinite; width:max-content; }
.strip span{font-size:0.86rem; color:var(--charcoal-soft); font-family:'Archivo';}
.strip span b{color:var(--terracotta); font-weight:600;}
@keyframes scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* Sections */
section{padding:104px 0;}
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px; margin-bottom:52px; }
.section-head h2{font-size:clamp(1.9rem,3vw,2.5rem); max-width:14ch;}
.section-head p{color:var(--charcoal-soft); max-width:34ch; margin:0;}
.section-kicker{ font-size:0.82rem; color:var(--brass); font-weight:600; letter-spacing:0.02em; margin-bottom:14px; display:block; }

/* Categories Grid */
.cat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.cat-card{ background:#fff; border:1px solid var(--line); border-radius:170px 170px 8px 8px; padding:0 0 30px; overflow:hidden; transition:transform .25s ease, box-shadow .25s ease; }
.cat-card:hover{transform:translateY(-6px); box-shadow:0 18px 34px -20px rgba(42,38,34,0.35);}
.cat-card .swatch{ aspect-ratio:1/1.1; display:flex; align-items:center; justify-content:center; }
.cat-card .swatch svg{width:52%; height:52%;}
.cat-card h3{font-size:1.16rem; padding:0 24px; margin-top:22px;}
.cat-card p{ color:var(--charcoal-soft); font-size:0.88rem; padding:10px 24px 0; margin:0; }
.cat-card .count{ display:block; padding:16px 24px 0; font-size:0.82rem; color:var(--terracotta); font-weight:500; }
.c1 .swatch{background:#EFE6D8;} .c2 .swatch{background:#E9DAD1;} .c3 .swatch{background:#E3D8C4;} .c4 .swatch{background:#EADFE0;}

/* Article Grid */
.article-grid{ display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:28px; }
.article-card{display:flex; flex-direction:column;}
.article-thumb{ border-radius:14px 14px 4px 4px; aspect-ratio:5/4; margin-bottom:20px; position:relative; overflow:hidden; background:var(--blush); }
.article-card:first-child .article-thumb{aspect-ratio:16/12;}
.article-thumb img { width:100%; height:100%; object-fit:cover; }
.thumb-1{background:linear-gradient(160deg,#DCC7B4,#C7745A);}
.thumb-2{background:linear-gradient(160deg,#D9CBA8,#8FA093);}
.thumb-3{background:linear-gradient(160deg,#E3D3D8,#B7896F);}
.article-thumb::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:58%; background:linear-gradient(to top, rgba(21,51,42,0.32), transparent); }
.article-cat{ position:absolute; top:16px; left:16px; z-index:2; background:rgba(246,239,227,0.92); color:var(--emerald-deep); font-size:0.72rem; font-weight:600; padding:6px 12px; border-radius:20px; }
.article-card h3{font-size:1.18rem; line-height:1.32;}
.article-card:first-child h3{font-size:1.5rem;}
.article-meta{ margin-top:12px; font-size:0.82rem; color:var(--charcoal-soft); display:flex; gap:10px; align-items:center; }
.article-meta .dot{width:3px; height:3px; border-radius:50%; background:var(--charcoal-soft);}
.article-card p.excerpt{color:var(--charcoal-soft); font-size:0.94rem; margin-top:10px;}
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }

/* Newsletter */
.newsletter{ background:var(--emerald); border-radius:28px; padding:72px 60px; display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:center; position:relative; overflow:hidden; }
.newsletter::before{ content:""; position:absolute; width:520px; height:520px; border-radius:50%; border:1px solid rgba(246,239,227,0.14); top:-260px; right:-160px; }
.newsletter::after{ content:""; position:absolute; width:380px; height:380px; border-radius:50%; border:1px solid rgba(246,239,227,0.1); top:-190px; right:-90px; }
.newsletter h2{color:var(--cream); font-size:clamp(1.7rem,2.6vw,2.2rem); max-width:13ch;}
.newsletter p{color:rgba(246,239,227,0.78); margin-top:16px; max-width:38ch;}
.newsletter-form{ display:flex; gap:10px; margin-top:0; position:relative; z-index:1; }
.newsletter-form input{ flex:1; padding:16px 18px; border-radius:3px; border:1px solid rgba(246,239,227,0.3); background:rgba(246,239,227,0.08); color:var(--cream); font-family:'Archivo'; font-size:0.95rem; }
.newsletter-form input::placeholder{color:rgba(246,239,227,0.55);}
.newsletter-form button{ background:var(--terracotta); color:var(--cream); border:none; padding:0 26px; border-radius:3px; font-weight:500; font-size:0.92rem; cursor:pointer; transition:background .2s ease; }
.newsletter-form button:hover{background:#a94f30;}
.newsletter-fine{font-size:0.78rem; color:rgba(246,239,227,0.55); margin-top:14px;}

/* About */
.about{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:center; }
.about-art{ aspect-ratio:1/1.15; background:var(--blush); border-radius:999px 999px 6px 6px; position:relative; }
.about-art .ring{ position:absolute; inset:13%; border:1px solid var(--brass); border-radius:999px 999px 4px 4px; opacity:0.55; }
.about-art .mono{ position:absolute; bottom:9%; left:0; right:0; text-align:center; font-family:'Fraunces'; font-style:italic; color:var(--emerald-deep); font-size:1.4rem; }
.about-copy p{color:var(--charcoal-soft); margin-top:18px; font-size:1.02rem; max-width:52ch;}
.about-stats{display:flex; gap:44px; margin-top:36px;}
.about-stats div b{ display:block; font-family:'Fraunces'; font-size:1.7rem; color:var(--emerald); }
.about-stats div span{font-size:0.85rem; color:var(--charcoal-soft);}

/* Popular Grid */
.popular-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.pop-item{ background:var(--cream); padding:34px 30px; display:flex; flex-direction:column; gap:14px; }
.pop-num{font-family:'Fraunces'; font-style:italic; color:var(--brass); font-size:0.95rem;}
.pop-item h3{font-size:1.05rem; line-height:1.35;}
.pop-item span.tag{font-size:0.78rem; color:var(--terracotta); font-weight:500;}

/* Forms & UI */
.search-form { display:flex; gap:10px; }
.search-form input { flex:1; padding:12px; border:1px solid var(--line); border-radius:3px; }
.search-form button { background:var(--emerald); color:#fff; padding:0 20px; border:none; border-radius:3px; }

/* Footer */
footer{ background:var(--emerald-deep); color:rgba(246,239,227,0.86); padding:76px 0 32px; margin-top:60px; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:56px; border-bottom:1px solid rgba(246,239,227,0.14); }
.footer-brand{font-family:'Fraunces'; font-size:1.3rem; color:var(--cream);}
.footer-col h4{ font-family:'Archivo'; font-size:0.82rem; color:rgba(246,239,227,0.5); font-weight:600; margin-bottom:16px; }
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;}
.footer-col a{font-size:0.92rem; color:rgba(246,239,227,0.82); }

/* Responsive */
@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr;}
  .hero-art{max-width:420px; margin:0 auto;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .article-grid{grid-template-columns:1fr 1fr;}
  .article-card:first-child{grid-column:1/-1;}
  .about{grid-template-columns:1fr;}
  .about-art{max-width:340px; margin:0 auto;}
  .popular-grid{grid-template-columns:1fr 1fr;}
  .newsletter{grid-template-columns:1fr; padding:52px 32px;}
  .footer-top{grid-template-columns:1fr 1fr; row-gap:36px;}
  .grid-3{grid-template-columns:1fr 1fr;}
}
@media (max-width:680px){
  .nav-links{display:none;}
  .nav-toggle{display:block; background:none; border:none; font-size:1.5rem; color:var(--charcoal);}
  
  .cat-grid{grid-template-columns:1fr 1fr; gap:16px;}
  .cat-card h3{font-size:1rem;}
  .article-grid{grid-template-columns:1fr;}
  .article-card:first-child{grid-column:auto;}
  .popular-grid{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;}
  .newsletter-form{flex-direction:column;}
  .grid-3{grid-template-columns:1fr;}
  
  /* Top spacing fix */
  section{padding:72px 0;}
  .wrap{padding-left:20px; padding-right:20px;}
  
  /* Flexbox fix for the crushed stats */
  .about-stats{flex-wrap:wrap; gap:24px;}
  
  /* Better contrast for header text collision on scroll */
  header{background:var(--cream);}
  .nav{padding:18px 20px;}
}
