/*
Theme Name: PremiumPet Signature
Theme URI: https://premiumpet.com.pl
Author: PremiumPet
Description: Autorska, responsywna strona PremiumPet zgodna z zaakceptowanym projektem.
Version: 1.0.4
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: premiumpet-signature
*/

:root{
  --cream:#f6f1e8;
  --cream-soft:#fbf8f2;
  --ink:#24201c;
  --muted:#625d56;
  --gold:#b38a39;
  --gold-dark:#936c24;
  --olive:#7d866c;
  --olive-dark:#667055;
  --line:rgba(36,32,28,.105);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:var(--cream);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit}

.pp-page{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(circle at 72% 15%,rgba(255,255,255,.78),transparent 34%),
    linear-gradient(135deg,var(--cream-soft) 0%,var(--cream) 62%,#efe6d9 100%);
}

.pp-mobile-icons{
  position:absolute;
  top:20px;
  left:22px;
  right:22px;
  z-index:10;
  display:none;
  justify-content:space-between;
  color:var(--gold);
}
.pp-mobile-icons a,.pp-mobile-icons span{
  width:34px;height:34px;
  display:grid;place-items:center;
  text-decoration:none;
}

.pp-hero{
  position:relative;
  min-height:790px;
  display:grid;
  place-items:center;
  padding:52px 32px 58px;
  overflow:hidden;
}

.pp-botanical{
  position:absolute;
  left:-8px;
  top:0;
  width:min(31vw,430px);
  height:auto;
  z-index:0;
  pointer-events:none;
  opacity:.78;
  filter:drop-shadow(0 18px 28px rgba(73,78,60,.12));
}

.pp-content{
  position:relative;
  z-index:2;
  width:min(720px,100%);
  margin-left:clamp(110px,12vw,190px);
  text-align:center;
}

.pp-logo{
  display:block;
  width:min(306px,55vw);
  height:auto;
  margin:-14px auto 22px;
}

.pp-rule{
  width:62px;height:1px;
  margin:0 auto 27px;
  background:var(--gold);
}

.pp-title{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(3.3rem,6.2vw,5.65rem);
  line-height:1.01;
  letter-spacing:-.047em;
  font-weight:400;
}
.pp-title span{
  display:block;
  color:var(--gold);
}

.pp-rule--mid{
  margin-top:28px;
  margin-bottom:27px;
  width:52px;
}

.pp-launch{
  margin:0 0 18px;
  font-size:.86rem;
  font-weight:700;
  letter-spacing:.34em;
  text-transform:uppercase;
}

.pp-copy{
  max-width:560px;
  margin:0 auto 48px;
  color:var(--muted);
  font-size:1.12rem;
  line-height:1.62;
}


.pp-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  padding:0 30px;
  border:1px solid var(--gold);
  border-radius:7px;
  color:var(--gold-dark);
  text-decoration:none;
  background:rgba(255,255,255,.12);
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  transition:.2s ease;
}
.pp-button:hover,.pp-button:focus-visible{
  background:var(--gold);
  color:#fffaf1;
  transform:translateY(-1px);
  outline:none;
}

.pp-email{
  margin:18px 0 0;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:9px;
  color:#5e6654;
  font-size:.96rem;
}
.pp-email a{text-decoration:none}
.pp-email a:hover{color:var(--gold-dark)}

.pp-features{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--line);
  background:rgba(248,243,235,.80);
}
.pp-feature{
  position:relative;
  min-height:222px;
  padding:35px 28px 31px;
  text-align:center;
}
.pp-feature + .pp-feature::before{
  content:"";
  position:absolute;
  left:0;top:34px;bottom:34px;width:1px;
  background:var(--line);
}
.pp-feature-icon{
  width:54px;height:54px;
  margin:0 auto 16px;
  color:var(--gold);
}
.pp-feature h2{
  margin:0;
  font-size:.81rem;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.pp-feature-rule{
  width:46px;height:1px;
  margin:16px auto 18px;
  background:var(--gold);
}
.pp-feature p{
  max-width:280px;
  margin:0 auto;
  color:var(--muted);
  font-size:.92rem;
  line-height:1.5;
}
.pp-feature-arrow{display:none}

.pp-footer{
  min-height:54px;
  display:grid;
  place-items:center;
  padding:14px 22px;
  background:var(--olive);
  color:#fbf7ef;
  font-size:.81rem;
  letter-spacing:.04em;
}

@media(max-width:820px){
  .pp-mobile-icons{display:flex}
  .pp-hero{
    min-height:auto;
    padding:78px 20px 38px;
  }
  .pp-botanical{
    width:52vw;
    left:-29vw;
    top:8px;
    opacity:.28;
  }
  .pp-content{
    width:100%;
    margin-left:0;
  }
  .pp-logo{
    width:min(238px,69vw);
    margin:-22px auto 18px;
  }
  .pp-rule{margin-bottom:34px}
  .pp-title{
    font-size:clamp(2.55rem,10.3vw,4.05rem);
  }
  .pp-rule--mid{
    margin-top:25px;
    margin-bottom:24px;
  }
  .pp-launch{
    font-size:.82rem;
    letter-spacing:.28em;
  }
  .pp-copy{
    max-width:335px;
    margin-bottom:58px;
    font-size:1rem;
    line-height:1.58;
  }
  .pp-button{
    min-height:49px;
    width:min(236px,82vw);
    padding:0 22px;
  }
  .pp-email{
    margin-top:32px;
    font-size:.84rem;
  }

  .pp-features{grid-template-columns:1fr}
  .pp-feature{
    min-height:0;
    padding:19px 23px;
    display:grid;
    grid-template-columns:48px 1fr 18px;
    align-items:center;
    gap:14px;
    text-align:left;
    border-top:1px solid var(--line);
  }
  .pp-feature + .pp-feature::before{display:none}
  .pp-feature-icon{width:41px;height:41px;margin:0}
  .pp-feature h2{
    font-size:.76rem;
    letter-spacing:.18em;
  }
  .pp-feature-rule,.pp-feature p{display:none}
  .pp-feature-arrow{
    display:block;
    color:var(--gold);
    font-size:1.85rem;
    line-height:1;
  }
}

@media(max-width:420px){
  .pp-hero{padding-inline:16px}
  .pp-logo{width:min(250px,74vw)}
  .pp-title{font-size:clamp(2.35rem,10vw,3.55rem)}
  .pp-button{width:min(260px,88vw)}
  .pp-email{font-size:.86rem}
}

@media(max-height:740px) and (max-width:820px){
  .pp-hero{padding-top:66px;padding-bottom:29px}
  .pp-logo{width:min(202px,59vw);margin:-16px auto 13px}
  .pp-title{font-size:clamp(2.1rem,8.7vw,3.1rem)}
  .pp-rule{margin-bottom:14px}
  .pp-rule--mid{margin:18px auto}
  .pp-launch{margin-bottom:12px}
  .pp-copy{margin-bottom:44px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

@media(max-width:820px){
  .pp-mobile-icons a svg{width:21px;height:21px}
  .pp-feature{padding-top:27px;padding-bottom:27px}
}

@media(max-width:820px){
  .pp-features{margin-top:18px}
}