/*
Theme Name: La Busta
Theme URI: https://labusta.it
Author: Alessandro Sampino
Description: Tema WordPress per La Busta, blog di risparmio personale pratico. Design ispirato a ricevute e ledger, palette carta/inchiostro/ottone.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: labusta
*/

:root{
  --paper:#F2EFE6;
  --paper-alt:#EAE5D6;
  --ink:#20281F;
  --ink-soft:#4A5245;
  --brass:#B8862E;
  --brass-dark:#8F6821;
  --sage:#5C7A5E;
  --rust:#A8432F;
  --line:#D8D2C0;
  --card:#FBFAF5;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block; height:auto;}
.wrap{max-width:1120px; margin:0 auto; padding:0 24px;}
.mono{font-family:'IBM Plex Mono', monospace;}
ul{list-style:none;}

/* HEADER */
header.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(242,239,230,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 24px; max-width:1120px; margin:0 auto;
}
.logo{
  font-family:'Fraunces', serif;
  font-weight:600;
  font-size:1.5rem;
  letter-spacing:-0.01em;
  display:flex; align-items:center; gap:8px;
}
.logo .mark{
  width:26px; height:20px;
  border:1.5px solid var(--ink);
  border-radius:2px;
  position:relative;
  flex-shrink:0;
}
.logo .mark::after{
  content:"";
  position:absolute; left:50%; top:50%;
  width:9px; height:9px;
  border:1.5px solid var(--brass);
  border-radius:50%;
  transform:translate(-50%,-50%);
}
.nav-links{
  display:flex; align-items:center; gap:36px;
  font-size:0.95rem;
  font-weight:500;
}
.nav-links ul{display:flex; align-items:center; gap:36px;}
.nav-links a{position:relative; padding:4px 0;}
.nav-links a:not(.cta-btn):hover::after{
  content:""; position:absolute; left:0; right:0; bottom:0;
  height:1px; background:var(--brass);
}
.cta-btn{
  background:var(--ink); color:var(--paper);
  padding:10px 20px; border-radius:3px;
  font-size:0.9rem; font-weight:600;
  white-space:nowrap;
}
.cta-btn:hover{background:var(--brass-dark);}
.menu-toggle{display:none; background:none; border:none; cursor:pointer; padding:4px;}
.menu-toggle span{display:block; width:24px; height:2px; background:var(--ink); margin:5px 0;}

/* HERO */
.hero{padding:88px 24px 64px; position:relative;}
.hero-inner{
  max-width:1120px; margin:0 auto;
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;
}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--rust); font-weight:500;
  display:flex; align-items:center; gap:10px; margin-bottom:20px;
}
.eyebrow::before{content:"—"; color:var(--rust);}
h1{
  font-family:'Fraunces', serif; font-weight:600;
  font-size:clamp(2.4rem, 5vw, 3.6rem);
  line-height:1.08; letter-spacing:-0.02em; margin-bottom:24px;
}
h1 em{font-style:italic; font-weight:500; color:var(--brass-dark);}
.hero-sub{font-size:1.15rem; color:var(--ink-soft); max-width:46ch; margin-bottom:32px;}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
.btn-primary{
  background:var(--ink); color:var(--paper);
  padding:14px 28px; border-radius:3px; font-weight:600; font-size:0.98rem;
  display:inline-block; border:none; cursor:pointer;
}
.btn-primary:hover{background:var(--brass-dark);}
.btn-ghost{
  border:1px solid var(--ink); color:var(--ink);
  padding:13px 27px; border-radius:3px; font-weight:600; font-size:0.98rem;
  display:inline-block;
}
.btn-ghost:hover{border-color:var(--brass-dark); color:var(--brass-dark);}

/* receipt visual */
.receipt{
  background:var(--card); border:1px solid var(--line); border-radius:4px;
  padding:28px 26px; box-shadow:0 18px 40px -18px rgba(32,40,31,0.25);
  transform:rotate(1.2deg); position:relative;
}
.receipt::before, .receipt::after{
  content:""; position:absolute; left:0; right:0; height:1px;
  background:repeating-linear-gradient(90deg, var(--line) 0 6px, transparent 6px 12px);
}
.receipt::before{top:-1px;}
.receipt::after{bottom:-1px;}
.receipt-head{
  font-family:'IBM Plex Mono', monospace; font-size:0.75rem;
  letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft);
  border-bottom:1px dashed var(--line); padding-bottom:12px; margin-bottom:14px;
  display:flex; justify-content:space-between;
}
.receipt-row{
  display:flex; justify-content:space-between; align-items:baseline;
  font-family:'IBM Plex Mono', monospace; font-size:0.88rem;
  padding:9px 0; border-bottom:1px dotted var(--line); gap:12px;
}
.receipt-row span:first-child{color:var(--ink-soft);}
.receipt-row span:last-child{font-weight:500;}
.receipt-total{
  display:flex; justify-content:space-between; padding-top:14px; margin-top:4px;
  font-family:'IBM Plex Mono', monospace; font-weight:600; font-size:1rem; color:var(--sage);
}

/* TRUST STRIP */
.trust-strip{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:28px 24px; background:var(--paper-alt);}
.trust-inner{
  max-width:1120px; margin:0 auto; display:flex; flex-wrap:wrap; gap:20px 48px;
  justify-content:space-between; font-family:'IBM Plex Mono', monospace; font-size:0.82rem; color:var(--ink-soft);
}
.trust-inner strong{color:var(--ink); font-weight:600;}

/* SECTIONS */
section{padding:80px 24px;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:44px; gap:24px; flex-wrap:wrap;}
.section-eyebrow{
  font-family:'IBM Plex Mono', monospace; font-size:0.78rem; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--brass-dark); margin-bottom:10px; display:block; font-weight:500;
}
h2{font-family:'Fraunces', serif; font-weight:600; font-size:clamp(1.8rem, 3vw, 2.4rem); letter-spacing:-0.01em;}
.section-link{font-weight:600; font-size:0.95rem; border-bottom:1px solid var(--ink); padding-bottom:2px;}
.section-link:hover{color:var(--brass-dark); border-color:var(--brass-dark);}

/* ARTICLE GRID - receipt cards */
.grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:28px;}
.article-card{
  background:var(--card); border:1px solid var(--line); border-radius:4px;
  padding:26px 24px; position:relative; transition:transform .2s ease, box-shadow .2s ease;
  display:flex; flex-direction:column;
}
.article-card::before{
  content:""; position:absolute; top:-1px; left:0; right:0; height:1px;
  background:repeating-linear-gradient(90deg, var(--line) 0 6px, transparent 6px 12px);
}
.article-card:hover{transform:translateY(-4px); box-shadow:0 20px 34px -20px rgba(32,40,31,0.3);}
.article-card img{border-radius:3px; margin-bottom:16px; aspect-ratio:16/10; object-fit:cover;}
.cat-tag{
  font-family:'IBM Plex Mono', monospace; font-size:0.72rem; text-transform:uppercase;
  letter-spacing:0.06em; color:var(--sage); border:1px solid var(--sage);
  display:inline-block; padding:3px 9px; border-radius:20px; margin-bottom:14px; width:fit-content;
}
.article-card h3{font-family:'Fraunces', serif; font-weight:600; font-size:1.22rem; line-height:1.28; margin-bottom:12px; letter-spacing:-0.01em;}
.article-card h3 a:hover{color:var(--brass-dark);}
.article-card p{color:var(--ink-soft); font-size:0.92rem; margin-bottom:18px; flex-grow:1;}
.article-meta{
  display:flex; justify-content:space-between; align-items:center;
  border-top:1px dashed var(--line); padding-top:14px;
  font-family:'IBM Plex Mono', monospace; font-size:0.78rem; color:var(--ink-soft);
}
.article-meta a{font-weight:600; color:var(--brass-dark);}
.empty-state{color:var(--ink-soft); font-size:0.95rem;}

/* METHOD / VALUE STRIP */
.method{background:var(--ink); color:var(--paper);}
.method .section-eyebrow{color:var(--brass);}
.method-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:40px; margin-top:44px;}
.method-item .num{font-family:'IBM Plex Mono', monospace; color:var(--brass); font-size:0.85rem; margin-bottom:14px; display:block;}
.method-item h3{font-family:'Fraunces', serif; font-weight:600; font-size:1.3rem; margin-bottom:12px;}
.method-item p{color:#C9CFC5; font-size:0.94rem;}

/* NEWSLETTER */
.newsletter{background:var(--paper-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.news-inner{
  max-width:1120px; margin:0 auto; padding:64px 24px;
  display:grid; grid-template-columns:1fr auto; gap:40px; align-items:center;
}
.news-inner h2{font-size:clamp(1.6rem, 3vw, 2.1rem); margin-bottom:10px;}
.news-inner p{color:var(--ink-soft); max-width:44ch;}
.news-form{display:flex; gap:10px; min-width:340px;}
.news-form input{
  flex:1; padding:14px 16px; border:1px solid var(--line); border-radius:3px;
  font-family:'IBM Plex Sans', sans-serif; font-size:0.95rem; background:var(--card);
}
.news-form input:focus{outline:2px solid var(--brass); outline-offset:1px;}
.news-form button{
  background:var(--ink); color:var(--paper); border:none; padding:14px 24px;
  border-radius:3px; font-weight:600; cursor:pointer; font-size:0.95rem; white-space:nowrap;
}
.news-form button:hover{background:var(--brass-dark);}

/* SINGLE POST */
.single-wrap{max-width:760px; margin:0 auto; padding:64px 24px 100px;}
.single-meta{
  font-family:'IBM Plex Mono', monospace; font-size:0.8rem; color:var(--ink-soft);
  border-bottom:1px dashed var(--line); padding-bottom:20px; margin-bottom:32px;
  display:flex; gap:20px; flex-wrap:wrap; align-items:center;
}
.single-wrap h1{font-size:clamp(2rem, 4vw, 2.8rem);}
.single-thumb{margin:32px 0; border-radius:4px; overflow:hidden;}
.post-content{font-size:1.08rem; color:var(--ink);}
.post-content p{margin-bottom:1.4em;}
.post-content h2{margin:2em 0 0.6em; font-size:1.6rem;}
.post-content h3{margin:1.6em 0 0.5em; font-size:1.3rem; font-family:'Fraunces', serif; font-weight:600;}
.post-content ul, .post-content ol{margin:0 0 1.4em 1.4em;}
.post-content li{margin-bottom:0.5em;}
.post-content a{color:var(--brass-dark); text-decoration:underline;}
.post-content blockquote{
  border-left:3px solid var(--brass); padding:4px 0 4px 20px; margin:1.6em 0;
  font-style:italic; color:var(--ink-soft);
}
.post-content img{border-radius:4px; margin:1.6em 0;}
.post-nav{
  display:flex; justify-content:space-between; margin-top:56px; padding-top:24px;
  border-top:1px solid var(--line); font-weight:600; font-size:0.92rem; gap:20px;
}
.post-nav a:hover{color:var(--brass-dark);}

/* ARCHIVE / INDEX */
.archive-header{padding:56px 24px 0; max-width:1120px; margin:0 auto;}
.archive-header h1{font-size:clamp(1.8rem, 3.4vw, 2.4rem);}
.pagination{
  display:flex; gap:12px; justify-content:center; margin-top:20px;
  font-family:'IBM Plex Mono', monospace; font-size:0.85rem;
}
.pagination a, .pagination span{
  padding:8px 14px; border:1px solid var(--line); border-radius:3px;
}
.pagination .current{background:var(--ink); color:var(--paper);}

/* FOOTER */
footer.site-footer{padding:64px 24px 32px;}
.footer-grid{
  max-width:1120px; margin:0 auto; display:grid; grid-template-columns:1.4fr repeat(3, 1fr);
  gap:40px; padding-bottom:40px; border-bottom:1px solid var(--line);
}
.footer-brand .logo{margin-bottom:14px;}
.footer-brand p{color:var(--ink-soft); font-size:0.9rem; max-width:32ch;}
.footer-col h4{font-family:'IBM Plex Mono', monospace; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-soft); margin-bottom:16px;}
.footer-col a{display:block; font-size:0.92rem; margin-bottom:10px; color:var(--ink);}
.footer-col a:hover{color:var(--brass-dark);}
.footer-col ul li{margin-bottom:10px;}
.footer-bottom{
  max-width:1120px; margin:0 auto; padding-top:24px; display:flex; justify-content:space-between;
  flex-wrap:wrap; gap:12px; font-family:'IBM Plex Mono', monospace; font-size:0.78rem; color:var(--ink-soft);
}

/* RESPONSIVE */
@media (max-width: 860px){
  .hero-inner{grid-template-columns:1fr; gap:40px;}
  .receipt{transform:none; max-width:420px;}
  .grid{grid-template-columns:1fr 1fr;}
  .method-grid{grid-template-columns:1fr; gap:32px;}
  .news-inner{grid-template-columns:1fr;}
  .news-form{min-width:0;}
  .footer-grid{grid-template-columns:1fr 1fr; gap:32px;}
}
@media (max-width: 600px){
  .nav-links{
    position:fixed; top:63px; left:0; right:0; bottom:0;
    background:var(--paper); flex-direction:column; align-items:flex-start;
    padding:28px 24px; gap:22px; font-size:1.1rem;
    transform:translateX(100%); transition:transform .25s ease;
  }
  .nav-links ul{flex-direction:column; align-items:flex-start; gap:22px;}
  .nav-links.open{transform:translateX(0);}
  .menu-toggle{display:block;}
  .grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr; gap:28px;}
  section{padding:56px 20px;}
  .hero{padding:48px 20px 48px;}
}
