/*
Theme Name: Well Planned Mess
Theme URI: https://wellplannedmess.com/
Author: Well Planned Mess
Description: A warm, airy garden-journal WordPress block theme for Well Planned Mess.
Version: 2.2.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: well-planned-mess
*/

:root{
  --wpm-cream:#F5F0E6;
  --wpm-paper:#FBF8F1;
  --wpm-green:#264A3B;
  --wpm-sage:#97A88E;
  --wpm-blue:#8FA8B3;
  --wpm-blue-light:#CBD8DD;
  --wpm-brown:#765B45;
  --wpm-char:#24302A;
  --wpm-tape:rgba(214,201,170,.80);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--wpm-cream);
  color:var(--wpm-char);
  -webkit-font-smoothing:antialiased;
}
.wp-site-blocks{padding:0!important;overflow:hidden}
a{text-underline-offset:.18em}
img{max-width:100%;height:auto}

/* paper texture */
.wpm-paper{
  background-color:var(--wpm-cream);
  background-image:
    radial-gradient(rgba(38,74,59,.032) .75px,transparent .75px),
    radial-gradient(rgba(118,91,69,.018) .65px,transparent .65px);
  background-position:0 0,8px 7px;
  background-size:15px 15px,19px 19px;
}

/* HEADER */
.wpm-topline{
  font:600 10px/1.2 Arial,sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(38,74,59,.10);
}
.wpm-topline p{margin:0}
.wpm-header{
  background:rgba(251,248,241,.97);
  border-bottom:1px solid rgba(38,74,59,.08);
}
.wpm-header-inner{min-height:72px}
.wpm-brand{
  font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive!important;
  font-size:30px!important;
  font-weight:600!important;
  line-height:1.05!important;
  color:var(--wpm-green)!important;
  letter-spacing:-.04em;
}
.wpm-brand a{text-decoration:none!important}
.wpm-header .wp-block-navigation{
  font-family:Arial,sans-serif;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.wpm-header .wp-block-navigation a{text-decoration:none}
.wpm-header .wp-block-navigation__responsive-container-open{color:var(--wpm-green)}

/* HERO */
.wpm-hero{
  min-height:520px;
  padding:28px 20px 22px;
}
.wpm-hero-copy{padding:54px 18px 48px 28px}
.wpm-hero-title{
  font-size:clamp(52px,6vw,86px)!important;
  line-height:.95!important;
  letter-spacing:-.045em;
  margin:0 0 10px!important;
  color:var(--wpm-green)!important;
}
.wpm-hand{
  font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive!important;
}
.wpm-tagline{
  margin:.15em 0 .55em!important;
  font-size:clamp(25px,2.8vw,39px)!important;
  line-height:1.12!important;
  color:var(--wpm-blue);
  transform:rotate(-1.2deg);
}
.wpm-rule{
  width:98px!important;
  margin:18px 0 26px!important;
  border:none!important;
  border-top:2px solid var(--wpm-sage)!important;
}
.wpm-hero-intro{font-size:clamp(19px,1.65vw,24px)!important;line-height:1.45!important}
.wpm-btn a{
  background:var(--wpm-sage)!important;
  color:white!important;
  border-radius:5px 7px 4px 6px!important;
  font:700 11px Arial,sans-serif!important;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:15px 22px!important;
}
.wpm-btn a:hover{filter:brightness(.95)}
.wpm-photo{
  position:relative;
  overflow:visible;
}
.wpm-hero-photo{
  min-height:455px;
  background-image:url('assets/images/hero.jpg');
  background-position:center;
  background-size:cover;
  clip-path:polygon(3% 5%,98% 0,100% 94%,3% 100%,0 18%);
  box-shadow:0 12px 28px rgba(31,49,41,.08);
}
.wpm-hero-photo:before,
.wpm-about-photo:before{
  content:"";
  position:absolute;
  z-index:2;
  width:112px;
  height:29px;
  background:var(--wpm-tape);
  top:-5px;
  left:40%;
  transform:rotate(-4deg);
  box-shadow:0 1px 2px rgba(0,0,0,.06);
}

/* CATEGORY CARDS */
.wpm-section{padding:24px 24px 54px}
.wpm-section-label{
  text-align:center;
  margin:0 0 22px!important;
  color:var(--wpm-brown);
  font:600 10px Arial,sans-serif!important;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.wpm-cards{gap:24px}
.wpm-card{
  background:var(--wpm-paper);
  padding:12px 12px 25px;
  border:1px solid rgba(118,91,69,.08);
  border-radius:9px 13px 8px 12px;
  box-shadow:0 8px 22px rgba(31,49,41,.075);
}
.wpm-card:nth-child(1){transform:rotate(-.20deg)}
.wpm-card:nth-child(2){transform:rotate(.16deg)}
.wpm-card:nth-child(3){transform:rotate(-.12deg)}
.wpm-card-photo{
  height:220px;
  background-position:center;
  background-size:cover;
  border-radius:7px 9px 6px 8px;
}
.wpm-garden{background-image:url('assets/images/garden.jpg')}
.wpm-kitchen{background-image:url('assets/images/kitchen.jpg')}
.wpm-home{background-image:url('assets/images/home.jpg')}
.wpm-card h3{
  text-align:center;
  font-size:29px!important;
  margin:18px 0 7px!important;
}
.wpm-card p{text-align:center;margin:.4em 0}
.wpm-kicker{
  font:600 10px Arial,sans-serif!important;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.wpm-card .wpm-kicker{margin-top:18px!important}

/* LATEST */
.wpm-latest-wrap{padding:10px 24px 48px}
.wpm-latest{
  background:rgba(251,248,241,.82);
  padding:32px 32px 36px;
  border:1px solid rgba(118,91,69,.07);
  border-radius:10px 7px 12px 8px;
  box-shadow:0 5px 18px rgba(31,49,41,.035);
}
.wpm-latest-head{margin-bottom:18px}
.wpm-latest h2{
  margin:0!important;
  font-size:clamp(35px,4vw,54px)!important;
  letter-spacing:-.025em;
}
.wpm-latest .wp-block-post-featured-image img{
  border-radius:6px;
  aspect-ratio:16/10;
  object-fit:cover;
}
.wpm-latest .wp-block-post-terms{
  margin-top:10px;
  font-family:Arial,sans-serif;
  font-size:9px!important;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.wpm-latest .wp-block-post-title{
  font-size:21px!important;
  line-height:1.1;
  margin:.35em 0 .35em!important;
}
.wpm-latest .wp-block-post-title a{text-decoration:none}
.wpm-empty-note{
  padding:25px;
  border:1px dashed rgba(38,74,59,.25);
  border-radius:8px;
  text-align:center;
  color:var(--wpm-brown);
}

/* ABOUT / NEWSLETTER */
.wpm-about{
  padding:42px 24px 62px;
  align-items:center;
}
.wpm-about-photo{
  min-height:360px;
  background-image:url('assets/images/about.jpg');
  background-position:center;
  background-size:cover;
  border:10px solid var(--wpm-paper);
  box-shadow:0 7px 18px rgba(31,49,41,.11);
  transform:rotate(-1deg);
}
.wpm-about-photo:before{
  top:-18px;
  left:34%;
  transform:rotate(5deg);
}
.wpm-about-copy{padding:10px 18px}
.wpm-about-copy h2{
  font-size:clamp(38px,4vw,55px)!important;
  margin:0 0 12px!important;
}
.wpm-patience{
  color:var(--wpm-blue);
  font-size:clamp(24px,2.7vw,36px)!important;
  line-height:1.45!important;
  transform:rotate(-1deg);
  margin:22px 0!important;
}
.wpm-news{
  background:var(--wpm-blue-light);
  padding:30px 27px 32px;
  border-radius:7px 10px 6px 9px;
  transform:rotate(.2deg);
  box-shadow:0 7px 18px rgba(31,49,41,.05);
}
.wpm-news h3{
  color:#557487!important;
  margin-top:0!important;
  font-size:29px!important;
}
.wpm-news p{font-size:16px}
.wpm-news .wp-block-button__link{
  background:var(--wpm-green)!important;
  color:white!important;
  border-radius:5px!important;
  font:700 10px Arial,sans-serif!important;
  letter-spacing:.12em;
  text-transform:uppercase;
}

/* FOOTER */
.wpm-footer{
  background:#D7E1E1;
  border-top:1px solid rgba(38,74,59,.12);
  padding:38px 28px 22px;
}
.wpm-footer .wp-block-site-title{
  font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive;
  font-size:27px!important;
}
.wpm-footer .wp-block-site-title a{text-decoration:none}
.wpm-footer h5{
  font-family:Arial,sans-serif;
  font-size:10px!important;
  text-transform:uppercase;
  letter-spacing:.14em;
}
.wpm-footer p,.wpm-footer a{font-size:14px}
.wpm-footer-small{
  padding-top:16px;
  margin-top:18px;
  border-top:1px solid rgba(38,74,59,.10);
  font-family:Arial,sans-serif;
  font-size:10px!important;
  letter-spacing:.08em;
}

/* POSTS / PAGES */
.wpm-post-shell{max-width:850px;margin:auto;padding:58px 24px 72px}
.wpm-post-shell .wp-block-post-title{font-size:clamp(42px,5vw,52px)!important}
.wpm-post-shell .wp-block-post-featured-image img{border-radius:9px}
.wpm-archive{padding:52px 24px 70px}
.wpm-archive .wp-block-post-template{gap:28px}

/* Responsive */
@media(max-width:900px){
  .wpm-header{padding-left:18px!important;padding-right:18px!important}
  .wpm-hero-copy{padding-left:10px}
  .wpm-card-photo{height:190px}
}
@media(max-width:781px){
  .wpm-topline{display:none}
  .wpm-header-inner{min-height:58px}
  .wpm-brand{font-size:24px!important}
  .wpm-hero{padding:0 16px 30px}
  .wpm-hero-copy{padding:42px 8px 24px}
  .wpm-hero-photo{min-height:340px}
  .wpm-section,.wpm-latest-wrap,.wpm-about{padding-left:16px;padding-right:16px}
  .wpm-card{transform:none!important}
  .wpm-card-photo{height:260px}
  .wpm-latest{padding:25px 18px}
  .wpm-about-photo{min-height:330px}
  .wpm-news{transform:none}
}


/* ===== WPM V2.2 REFINEMENTS ===== */

/* tighter, more intentional header */
.wpm-header{
  padding-top:10px!important;
  padding-bottom:10px!important;
}
.wpm-header-inner{
  min-height:54px!important;
}
.wpm-brand{
  font-size:27px!important;
  letter-spacing:-.045em!important;
}
.wpm-header .wp-block-navigation{
  font-size:10px!important;
}
.wpm-header .wp-block-navigation__container{
  gap:22px!important;
}

/* hero: reduce excess height and improve balance */
.wpm-hero{
  min-height:460px!important;
  padding-top:18px!important;
  padding-bottom:14px!important;
}
.wpm-hero-copy{
  padding-top:36px!important;
  padding-bottom:34px!important;
}
.wpm-hero-title{
  font-size:clamp(50px,5.3vw,78px)!important;
}
.wpm-tagline{
  font-size:clamp(24px,2.4vw,34px)!important;
}
.wpm-hero-intro{
  max-width:470px;
}
.wpm-hero-photo{
  min-height:420px!important;
  border-radius:10px 7px 12px 8px;
}
.wpm-hero-photo:after{
  content:"";
  position:absolute;
  width:54px;
  height:78px;
  right:-12px;
  top:4px;
  background:
    linear-gradient(120deg, transparent 40%, rgba(38,74,59,.55) 41%, rgba(38,74,59,.55) 43%, transparent 44%) 0 0/18px 24px no-repeat,
    linear-gradient(72deg, transparent 42%, rgba(38,74,59,.45) 43%, rgba(38,74,59,.45) 45%, transparent 46%) 14px 20px/20px 27px no-repeat,
    linear-gradient(100deg, transparent 44%, rgba(38,74,59,.5) 45%, rgba(38,74,59,.5) 47%, transparent 48%) 28px 2px/18px 28px no-repeat;
  opacity:.75;
  transform:rotate(6deg);
}
.wpm-btn{
  margin-top:20px!important;
  margin-bottom:4px!important;
}

/* reduce empty vertical space between major homepage sections */
.wpm-section{
  padding-top:14px!important;
  padding-bottom:42px!important;
}
.wpm-latest-wrap{
  padding-top:4px!important;
  padding-bottom:34px!important;
}
.wpm-about{
  padding-top:28px!important;
  padding-bottom:42px!important;
}

/* cards: slightly more editorial and less boxy */
.wpm-cards{
  gap:28px!important;
}
.wpm-card{
  padding:11px 11px 22px!important;
  border-radius:8px 12px 7px 11px!important;
}
.wpm-card-photo{
  height:215px!important;
}
.wpm-card h3{
  font-size:27px!important;
  margin-top:15px!important;
}
.wpm-section-label{
  margin-bottom:18px!important;
}

/* Latest area */
.wpm-latest{
  padding-top:26px!important;
  padding-bottom:30px!important;
}
.wpm-latest h2{
  font-size:clamp(34px,3.6vw,48px)!important;
}
.wpm-latest-head{
  margin-bottom:14px!important;
}
.wpm-latest .wp-block-post-template{
  gap:22px!important;
}

/* About section */
.wpm-about-photo{
  min-height:310px!important;
}
.wpm-about-copy{
  padding-left:10px!important;
  padding-right:10px!important;
}
.wpm-about-copy h2{
  font-size:clamp(36px,3.4vw,48px)!important;
}
.wpm-patience{
  font-size:clamp(22px,2.3vw,32px)!important;
  line-height:1.35!important;
  margin:16px 0 18px!important;
}
.wpm-news{
  padding:25px 24px 27px!important;
}
.wpm-news h3{
  font-size:27px!important;
}

/* footer less tall */
.wpm-footer{
  padding-top:30px!important;
  padding-bottom:18px!important;
}

/* subtle hand-drawn divider motif */
.wpm-scribble{
  width:88px;
  height:9px;
  margin:0 auto 18px;
  position:relative;
}
.wpm-scribble:before,
.wpm-scribble:after{
  content:"";
  position:absolute;
  left:0;
  width:88px;
  border-top:2px solid var(--wpm-sage);
}
.wpm-scribble:before{top:2px;transform:rotate(-1.5deg)}
.wpm-scribble:after{top:6px;transform:rotate(.9deg);opacity:.45}

/* make the site title feel more like a logo lockup */
.wpm-brand-wrap{
  display:flex;
  flex-direction:column;
  gap:1px;
}
.wpm-brand-sub{
  font:600 8px Arial,sans-serif!important;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--wpm-brown);
  margin:0!important;
}

/* mobile tuning */
@media(max-width:781px){
  .wpm-header{
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
  .wpm-brand{font-size:23px!important}
  .wpm-brand-sub{display:none}
  .wpm-hero{
    min-height:auto!important;
  }
  .wpm-hero-copy{
    padding-top:30px!important;
    padding-bottom:18px!important;
  }
  .wpm-hero-photo{
    min-height:320px!important;
  }
  .wpm-card-photo{
    height:240px!important;
  }
  .wpm-about{
    padding-top:22px!important;
  }
}