:root{
  --cream:#fff1e0;
  --cream-2:#fff8ee;
  --paper:#fffaf3;
  --red:#c21b1b;
  --red-dark:#86100f;
  --black:#171717;
  --ink:#2c1f12;
  --muted:#6f5b47;
  --line:rgba(44,31,18,.18);
  --page:min(1240px,calc(100vw - 80px));
  --ease:cubic-bezier(.22,.61,.36,1);
  --snap:cubic-bezier(.16,1,.3,1);
  --shadow:0 26px 70px rgba(58,31,13,.17);
  --shadow-soft:0 14px 38px rgba(58,31,13,.12);
  --font:var(--whuploo-font,Poppins,Arial,Helvetica,sans-serif);
}

*{
  box-sizing:border-box
}

html{
  scroll-behavior:smooth
}

body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font);
  font-size:16px;
  line-height:normal;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden
}

a{
  color:inherit;
  text-decoration:none
}

img{
  display:block;
  max-width:100%
}

button{
  font:inherit
}

figure,
p,
h1,
h2,
h3{
  margin:0
}


/* =========================================================
   WORDPRESS / ASTRA ISOLATION
   ========================================================= */

body.whuploo-v3-home{
  margin:0!important;
  background:var(--cream)!important;
  color:var(--ink)!important;
  font-family:var(--font)!important;
  font-size:16px;
  line-height:normal;
}

body.whuploo-v3-home :where(h1,h2,h3,h4,h5,h6){
  margin:0;
  color:inherit;
  font-family:var(--font)!important;
  font-style:normal;
  font-weight:600;
  letter-spacing:normal;
  line-height:normal;
  text-transform:none;
}

body.whuploo-v3-home :where(p){
  margin:0;
  color:inherit;
  font-family:var(--font);
}

body.whuploo-v3-home :where(a,button,input,select,textarea){
  font-family:var(--font);
}

body.whuploo-v3-home :where(button,input,select,textarea){
  font-size:inherit;
}


/* =========================================================
   SKIP LINK
   ========================================================= */

.skip-link{
  position:fixed;
  left:16px;
  top:-80px;
  z-index:200;
  background:#fff;
  color:#000;
  padding:12px 16px;
  border:2px solid #000
}

.skip-link:focus{
  top:16px
}


/* =========================================================
   HOMEPAGE BUTTONS

   Global header controls are owned by whuploo-global.css.
   ========================================================= */

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 26px;
  border:1px solid transparent;
  border-radius:0;
  background-image:none;
  box-sizing:border-box;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  font-weight:600;
  transition:
    transform .24s var(--snap),
    box-shadow .24s var(--ease),
    background .24s var(--ease)
}

.button:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 22px rgba(0,0,0,.13)
}

.button-red{
  background:var(--red);
  color:white
}

.button-cream{
  background:var(--cream);
  color:var(--black)
}

.button-outline{
  border-color:rgba(255,255,255,.72);
  color:white;
  background:transparent
}


/* =========================================================
   TYPE
   ========================================================= */

.eyebrow,
.section-kicker{
  font-size:11px;
  font-weight:900;
  letter-spacing:.17em;
  text-transform:uppercase
}

.section-kicker{
  color:var(--red);
  margin-bottom:18px
}

.hero h1,
.proof-title h2,
.conversation h2,
.shirts h2,
.mugs h2,
.headwear h2,
.confidence h2,
.final-cta h2,
.feature-copy h3,
.mug-feature h3,
.cap-copy h3{
  font-weight:900;
  letter-spacing:-.065em;
  line-height:.88
}


/* =========================================================
   REVEAL / MOTION
   ========================================================= */

[data-reveal]{
  --reveal-x:0px;
  --reveal-y:0px;
  --reveal-scale:1;
  --reveal-rotate:0deg;
  --parallax-y:0px;

  opacity:0;

  translate:var(--reveal-x) calc(var(--reveal-y) + var(--parallax-y));
  scale:var(--reveal-scale);
  rotate:var(--reveal-rotate);

  transition:
    opacity .7s var(--ease),
    translate 1s var(--snap),
    scale 1s var(--snap),
    rotate 1s var(--snap)
}

[data-reveal="left"]{
  --reveal-x:-68px;
  --reveal-y:26px;
  --reveal-rotate:-1deg
}

[data-reveal="right"]{
  --reveal-x:68px;
  --reveal-y:22px;
  --reveal-rotate:1deg
}

[data-reveal="up"]{
  --reveal-y:54px
}

[data-reveal="scale"]{
  --reveal-y:34px;
  --reveal-scale:.92;
  --reveal-rotate:-.7deg
}

[data-reveal].is-visible{
  opacity:1;
  --reveal-x:0px;
  --reveal-y:0px;
  --reveal-scale:1;
  --reveal-rotate:0deg
}

[data-parallax]{
  --parallax-y:0px
}

[data-parallax]:not([data-reveal]){
  translate:0 var(--parallax-y)
}


/* =========================================================
   HERO
   ========================================================= */

.hero{
  min-height:760px;
  position:relative;
  isolation:isolate
}

.hero-grid{
  width:var(--page);
  min-height:720px;
  margin:auto;
  display:grid;
  grid-template-columns:45% 55%;
  align-items:center;
  position:relative;
  z-index:2
}

.hero-copy{
  padding:22px 0 84px 4px;
  position:relative;
  z-index:4
}

.hero h1{
  font-size:clamp(74px,7vw,112px);
  color:var(--red-dark);
  margin-top:22px;
  max-width:650px
}

.hero h1 span{
  display:inline-block;
  transform:translateX(44px);
  color:var(--red)
}

.hero-intro{
  font-size:15px;
  line-height:1.75;
  max-width:430px;
  margin:30px 0 28px
}

.hero-visual{
  height:670px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  position:relative;
  padding-top:12px
}

.hero-visual img{
  width:min(640px,91%);
  height:610px;
  object-fit:cover;
  object-position:center top;
  position:relative;
  z-index:3;
  box-shadow:var(--shadow);
  clip-path:polygon(5% 0,100% 0,96% 94%,0 100%)
}

.hero-visual::before{
  content:"";
  position:absolute;
  right:-46px;
  top:74px;
  width:54%;
  height:530px;
  background:var(--red);
  z-index:1;
  clip-path:polygon(18% 0,100% 0,100% 100%,0 87%);
  pointer-events:none
}

.hero-visual::after{
  content:"";
  position:absolute;
  left:7%;
  bottom:42px;
  width:160px;
  height:12px;
  background:var(--red);
  transform:rotate(-7deg);
  z-index:5;
  pointer-events:none
}

.hero::before{
  content:"SIDE EFFECTS";
  position:absolute;
  left:-1.5vw;
  bottom:-18px;
  color:rgba(134,16,15,.055);
  font-size:clamp(110px,17vw,270px);
  font-weight:900;
  letter-spacing:-.09em;
  line-height:.7;
  white-space:nowrap;
  z-index:0;
  pointer-events:none
}

.hero-ghost{
  display:none
}

.scroll-cue{
  position:absolute;
  right:max(30px,calc((100vw - 1240px)/2));
  bottom:22px;
  width:2px;
  height:76px;
  background:rgba(44,31,18,.18);
  overflow:hidden
}

.scroll-cue span{
  display:block;
  width:100%;
  height:28px;
  background:var(--red);
  animation:scrollCue 2.1s ease-in-out infinite
}

@keyframes scrollCue{
  0%{
    transform:translateY(-30px)
  }

  55%,
  100%{
    transform:translateY(80px)
  }
}


/* =========================================================
   WHY WHUPLOO / PROOF
   ========================================================= */

.proof{
  background:var(--black);
  color:white;
  position:relative;
  z-index:5;
  margin-top:-32px;
  clip-path:polygon(0 7%,100% 0,100% 92%,0 100%);
  padding:118px 0 130px
}

.proof:before{
  content:"";
  position:absolute;
  width:150px;
  height:11px;
  background:var(--red);
  left:max(40px,calc((100vw - 1240px)/2));
  top:42px;
  transform:rotate(-4deg)
}

.proof-shell{
  width:var(--page);
  margin:auto;
  display:grid;
  grid-template-columns:29% 71%;
  gap:48px;
  align-items:center
}

.proof-title h2{
  font-size:clamp(52px,5.2vw,82px);
  line-height:.86;
  letter-spacing:-.07em
}

.proof-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.25);
  border-bottom:1px solid rgba(255,255,255,.12)
}

.proof-grid article{
  min-height:210px;
  border-left:1px solid rgba(255,255,255,.16);
  padding:22px 20px 18px;
  position:relative
}


/* Prevent Gutenberg block-gap margins from shifting cards 02–04.
   The intentional odd-card translate below remains intact. */

.proof-grid > article{
  margin-block-start:0!important;
  margin-block-end:0!important
}

.proof-grid article:first-child{
  border-left:0
}

.proof-grid article:nth-child(odd){
  transform:translateY(20px)
}

.proof-grid article span{
  font-size:10px;
  color:#fff6;
  letter-spacing:.16em
}

.proof-grid h3{
  margin-top:55px;
  font-size:16px
}

.proof-grid p{
  margin-top:10px;
  color:#ffffff9c;
  font-size:11px;
  line-height:1.6
}


/* =========================================================
   KINETIC STRIP
   ========================================================= */

.kinetic-strip{
  height:78px;
  background:var(--cream);
  overflow:hidden;
  display:flex;
  align-items:center;
  border-bottom:1px solid rgba(44,31,18,.08);
  transform:rotate(-1.3deg) scale(1.02);
  position:relative;
  z-index:7;
  margin:-30px 0 34px
}

.kinetic-track{
  display:flex;
  align-items:center;
  gap:38px;
  white-space:nowrap;
  min-width:max-content;
  animation:ticker 22s linear infinite;
  color:var(--red-dark);
  font-size:28px;
  font-weight:900;
  letter-spacing:-.045em;
  text-transform:uppercase
}

.kinetic-track i{
  width:9px;
  height:9px;
  background:var(--red);
  display:block;
  transform:rotate(45deg)
}

@keyframes ticker{
  to{
    transform:translateX(-50%)
  }
}


/* =========================================================
   CONVERSATION COLLAGE
   ========================================================= */

.conversation{
  width:var(--page);
  height:980px;
  margin:auto;
  position:relative;
  padding-top:112px
}

.conversation-copy{
  position:absolute;
  left:4%;
  top:102px;
  width:52%;
  z-index:6
}

.conversation h2{
  font-size:clamp(58px,6vw,92px);
  color:var(--red-dark);
  max-width:770px
}

.conversation-copy>p:last-child{
  max-width:520px;
  margin-top:24px;
  font-size:14px;
  line-height:1.7
}

.conversation figure{
  position:absolute;
  margin:0;
  z-index:2
}

.conversation figure img{
  width:100%;
  height:100%;
  object-fit:cover
}

.conversation figcaption{
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.11em;
  margin-top:10px
}

.conversation-one{
  left:2%;
  top:440px;
  width:46%;
  height:430px;
  box-shadow:var(--shadow);
  transform:rotate(-1.4deg)
}

.conversation-two{
  right:1%;
  top:205px;
  width:27%;
  height:335px;
  box-shadow:var(--shadow-soft);
  transform:rotate(2.2deg)
}

.conversation-three{
  right:24%;
  top:575px;
  width:22%;
  height:250px;
  box-shadow:var(--shadow-soft);
  transform:rotate(-3deg);
  z-index:5!important
}

.conversation-block{
  position:absolute;
  right:-8vw;
  bottom:24px;
  width:42%;
  height:255px;
  background:var(--red);
  z-index:-1;
  clip-path:polygon(8% 8%,100% 0,100% 100%,0 88%)
}


/* =========================================================
   T-SHIRTS — SHARED
   ========================================================= */

.shirts{
  background:var(--cream-2);
  position:relative;
  overflow:clip
}

.shirts:before{
  content:"";
  position:absolute;
  left:-12vw;
  top:315px;
  width:48vw;
  height:420px;
  border:2px solid rgba(194,27,27,.14);
  transform:rotate(-7deg)
}

.shirts-heading{
  width:var(--page);
  margin:auto;
  position:relative;
  z-index:6
}

.shirts h2{
  color:var(--red-dark);
  max-width:760px
}

.shirts h2 span{
  color:var(--red);
  display:inline-block
}

.shirts-heading>p:last-child{
  max-width:540px;
  margin-top:24px;
  line-height:1.7
}

.shirts figure{
  position:absolute;
  margin:0;
  z-index:2
}

.shirts figure img{
  width:100%;
  height:100%;
  object-fit:cover
}

.shirt-one{
  box-shadow:var(--shadow);
  transform:rotate(1.2deg)
}

.shirt-two{
  box-shadow:var(--shadow-soft);
  transform:rotate(3deg)
}

.shirt-three{
  border:5px solid var(--cream-2);
  box-shadow:var(--shadow-soft);
  transform:rotate(-4deg);
  z-index:4!important
}

.shirt-feature{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  background:var(--black);
  color:#fff;
  display:grid;
  align-items:center
}

.shirt-feature:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:16%;
  height:18px;
  background:var(--red)
}

.shirt-lineup{
  background:var(--cream);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:var(--shadow);
  position:relative;
  z-index:2
}

.shirt-lineup img{
  width:100%;
  height:100%;
  object-fit:contain
}

.feature-copy p{
  color:#ffffffb2
}


/* =========================================================
   T-SHIRTS — DESKTOP
   ========================================================= */

@media (min-width:901px){

  .shirts{
    min-height:1450px;
    padding-top:145px
  }

  .shirts-heading{
    padding-left:5%
  }

  .shirts h2{
    font-size:clamp(65px,7vw,108px)
  }

  .shirts h2 span{
    transform:translateX(96px)
  }

  .shirts-heading>p:last-child{
    font-size:14px
  }

  .shirt-one{
    left:max(40px,calc((100vw - 1240px)/2));
    top:510px;
    width:min(540px,40vw);
    height:500px
  }

  .shirt-two{
    right:max(54px,calc((100vw - 1240px)/2));
    top:370px;
    width:min(320px,24vw);
    height:330px
  }

  .shirt-three{
    right:max(290px,calc((100vw - 830px)/2));
    top:740px;
    width:min(280px,21vw);
    height:290px
  }

  .shirt-feature{
    min-height:390px;
    grid-template-columns:minmax(0,57%) minmax(0,43%);
    clip-path:polygon(0 10%,100% 0,100% 100%,0 100%);
    padding:80px max(40px,calc((100vw - 1240px)/2)) 36px
  }

  .shirt-lineup{
    height:370px;
    transform:translate(-28px,-76px) rotate(-2.1deg)
  }

  .feature-copy{
    padding-left:68px
  }

  .feature-copy h3{
    font-size:clamp(48px,4.5vw,70px)
  }

  .feature-copy p{
    margin:22px 0 30px;
    font-size:14px
  }

}


/* =========================================================
   T-SHIRTS — TABLET
   ========================================================= */

@media (min-width:481px) and (max-width:900px){

  .shirts{
    min-height:1160px;
    padding-top:110px
  }

  .shirts-heading{
    padding-left:0
  }

  .shirts h2{
    font-size:50px
  }

  .shirts h2 span{
    transform:translateX(12%)
  }

  .shirts-heading>p:last-child{
    font-size:13px
  }

  .shirt-one{
    left:18px;
    top:390px;
    width:69%;
    height:335px
  }

  .shirt-two{
    right:14px;
    top:330px;
    width:34%;
    height:190px
  }

  .shirt-three{
    right:5%;
    top:595px;
    width:33%;
    height:176px
  }

  .shirt-feature{
    min-height:350px;
    padding:74px 18px 38px;
    grid-template-columns:1fr;
    clip-path:polygon(0 6%,100% 0,100% 100%,0 100%)
  }

  .shirt-lineup{
    width:92%;
    height:235px;
    transform:translate(0,-82px) rotate(-2deg);
    margin-bottom:-68px
  }

  .feature-copy{
    padding:0 8px 8px
  }

  .feature-copy h3{
    font-size:44px
  }

  .feature-copy p{
    font-size:12px;
    margin:16px 0 24px
  }

}


/* =========================================================
   T-SHIRTS — MOBILE
   ========================================================= */

@media (max-width:480px){

  .shirts{
    min-height:1180px;
    padding-top:110px
  }

  .shirts-heading{
    padding-left:0
  }

  .shirts h2{
    font-size:50px
  }

  .shirts h2 span{
    transform:translateX(12%)
  }

  .shirts-heading>p:last-child{
    font-size:13px
  }

  .shirt-one{
    left:18px;
    top:390px;
    width:69%;
    height:300px
  }

  .shirt-two{
    right:14px;
    top:330px;
    width:34%;
    height:165px
  }

  .shirt-three{
    right:5%;
    top:595px;
    width:33%;
    height:150px
  }

  .shirt-feature{
    min-height:350px;
    padding:74px 18px 38px;
    grid-template-columns:1fr;
    clip-path:polygon(0 6%,100% 0,100% 100%,0 100%)
  }

  .shirt-lineup{
    width:92%;
    height:235px;
    transform:translate(0,-82px) rotate(-2deg);
    margin-bottom:-68px
  }

  .feature-copy{
    padding:0 8px 8px
  }

  .feature-copy h3{
    font-size:44px
  }

  .feature-copy p{
    font-size:12px;
    margin:16px 0 24px
  }

}


/* =========================================================
   MUGS — SHARED
   ========================================================= */

.mugs{
  background:var(--cream);
  position:relative;
  overflow:clip
}

.mugs:after{
  content:"";
  position:absolute;
  left:-4vw;
  top:160px;
  width:31vw;
  height:8px;
  background:linear-gradient(90deg,var(--red),transparent)
}

.mugs-heading{
  width:var(--page);
  margin:auto;
  position:relative;
  z-index:8
}

.mugs h2{
  color:var(--red-dark);
  max-width:820px
}

.mugs h2 span{
  color:var(--red);
  display:inline-block
}

.mugs-heading>p:last-child{
  max-width:600px;
  margin-top:24px;
  line-height:1.7
}

.mug-stage{
  width:var(--page);
  position:relative
}

.mug-stage figure{
  position:absolute;
  margin:0;
  z-index:3
}

.mug-stage figure img{
  width:100%;
  height:100%;
  object-fit:cover
}

.mug-red-plane{
  position:absolute;
  background:var(--red);
  clip-path:polygon(16% 0,100% 0,100% 100%,0 88%);
  z-index:0
}

.mug-one{
  transform:rotate(-1.3deg)
}

.mug-two{
  box-shadow:var(--shadow-soft);
  transform:rotate(3.2deg)
}

.mug-three{
  border:5px solid var(--cream);
  box-shadow:var(--shadow-soft);
  transform:rotate(-3.4deg);
  z-index:5!important
}

.mug-feature{
  position:absolute;
  background:var(--paper);
  display:grid;
  box-shadow:var(--shadow);
  z-index:7
}

.mug-feature-copy{
  background:var(--black);
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center
}

.mug-feature p{
  color:#ffffffa8
}

.mug-product{
  display:flex;
  align-items:center;
  justify-content:center
}

.mug-product img{
  width:100%;
  height:100%;
  object-fit:contain;
  max-height:350px
}


/* =========================================================
   MUGS — DESKTOP
   ========================================================= */

@media (min-width:901px){

  .mugs{
    min-height:1480px;
    padding-top:150px
  }

  .mugs-heading{
    padding-left:4%
  }

  .mugs h2{
    font-size:clamp(66px,7vw,106px)
  }

  .mugs h2 span{
    transform:translateX(130px)
  }

  .mugs-heading>p:last-child{
    font-size:14px
  }

  .mug-stage{
    height:650px;
    margin:70px auto 0
  }

  .mug-red-plane{
    right:-12vw;
    top:18px;
    width:47%;
    height:550px
  }

  .mug-one{
    left:0;
    top:70px;
    width:48%;
    height:470px;
    box-shadow:-18px 18px 0 var(--red),var(--shadow)
  }

  .mug-two{
    right:3%;
    top:0;
    width:26%;
    height:245px
  }

  .mug-three{
    right:22%;
    bottom:4px;
    width:23%;
    height:230px
  }

  .mug-feature{
    left:max(30px,calc((100vw - 1180px)/2));
    right:0;
    bottom:-40px;
    min-height:425px;
    grid-template-columns:43% 57%;
    clip-path:polygon(0 0,100% 8%,100% 100%,0 100%)
  }

  .mug-feature-copy{
    padding:72px 58px
  }

  .mug-feature h3{
    font-size:clamp(48px,4.6vw,72px)
  }

  .mug-feature p{
    margin:20px 0 30px;
    font-size:14px
  }

  .mug-product{
    padding:38px 60px
  }

}


/* =========================================================
   MUGS — TABLET
   ========================================================= */

@media (min-width:481px) and (max-width:900px){

  .mugs{
    min-height:1190px;
    padding-top:110px
  }

  .mugs-heading{
    padding-left:0
  }

  .mugs h2{
    font-size:50px
  }

  .mugs h2 span{
    transform:translateX(12%)
  }

  .mugs-heading>p:last-child{
    font-size:13px
  }

  .mug-stage{
    height:535px;
    margin:42px auto 0
  }

  .mug-red-plane{
    right:-18px;
    top:28px;
    width:53%;
    height:380px
  }

  .mug-one{
    left:0;
    top:70px;
    width:70%;
    height:320px;
    box-shadow:-10px 10px 0 var(--red),var(--shadow-soft)
  }

  .mug-two{
    right:0;
    top:0;
    width:34%;
    height:168px
  }

  .mug-three{
    right:5%;
    bottom:18px;
    width:34%;
    height:165px
  }

  .mug-feature{
    left:12px;
    right:0;
    bottom:-35px;
    grid-template-columns:1fr;
    min-height:0;
    clip-path:polygon(0 0,100% 4%,100% 100%,0 100%)
  }

  .mug-feature-copy{
    padding:48px 26px;
    min-height:245px
  }

  .mug-feature h3{
    font-size:43px
  }

  .mug-feature p{
    font-size:12px;
    margin:16px 0 24px
  }

  .mug-product{
    height:260px;
    padding:24px 34px
  }

}


/* =========================================================
   MUGS — MOBILE
   ========================================================= */

@media (max-width:480px){

  .mugs{
    min-height:1140px;
    padding-top:110px
  }

  .mugs-heading{
    padding-left:0
  }

  .mugs h2{
    font-size:50px
  }

  .mugs h2 span{
    transform:translateX(12%)
  }

  .mugs-heading>p:last-child{
    font-size:13px
  }

  .mug-stage{
    height:535px;
    margin:42px auto 0
  }

  .mug-red-plane{
    right:-18px;
    top:28px;
    width:53%;
    height:380px
  }

  .mug-one{
    left:0;
    top:70px;
    width:70%;
    height:290px;
    box-shadow:-10px 10px 0 var(--red),var(--shadow-soft)
  }

  .mug-two{
    right:0;
    top:0;
    width:34%;
    height:145px
  }

  .mug-three{
    right:5%;
    bottom:140px;
    width:34%;
    height:148px
  }

  .mug-feature{
    left:12px;
    right:0;
    bottom:-35px;
    grid-template-columns:1fr;
    min-height:0;
    clip-path:polygon(0 0,100% 4%,100% 100%,0 100%)
  }

  .mug-feature-copy{
    padding:48px 26px;
    min-height:245px
  }

  .mug-feature h3{
    font-size:43px
  }

  .mug-feature p{
    font-size:12px;
    margin:16px 0 24px
  }

  .mug-product{
    height:260px;
    padding:24px 34px
  }

}


/* =========================================================
   HEADWEAR — SHARED
   ========================================================= */

.headwear{
  background:var(--cream-2);
  position:relative;
  overflow:clip
}

.headwear-title{
  width:var(--page);
  margin:auto;
  position:relative;
  z-index:6
}

.headwear h2{
  color:var(--red-dark)
}

.headwear h2 span{
  color:var(--red);
  display:inline-block
}

.headwear-title>p:last-child{
  max-width:560px;
  line-height:1.7
}

.headwear-collage{
  width:var(--page);
  position:relative
}

.headwear-collage figure{
  position:absolute;
  margin:0
}

.headwear-collage img{
  width:100%;
  height:100%;
  object-fit:cover
}

.hat-one{
  box-shadow:var(--shadow);
  transform:rotate(1.5deg)
}

.hat-two{
  box-shadow:var(--shadow-soft);
  transform:rotate(-3deg);
  z-index:3
}

.hat-three{
  border:5px solid var(--cream-2);
  box-shadow:var(--shadow-soft);
  transform:rotate(3.2deg);
  z-index:5
}

.cap-feature{
  position:absolute;
  background:var(--paper);
  display:grid;
  align-items:center;
  box-shadow:var(--shadow-soft)
}

.cap-product{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center
}

.cap-product span{
  position:absolute;
  bottom:0;
  background:var(--red);
  clip-path:polygon(0 9%,100% 0,90% 100%,0 90%)
}

.cap-product img{
  position:relative;
  z-index:2;
  width:86%;
  height:88%;
  object-fit:contain
}

.cap-copy h3{
  color:var(--red-dark)
}

.cap-copy p{
  line-height:1.7
}


/* =========================================================
   HEADWEAR — DESKTOP
   ========================================================= */

@media (min-width:901px){

  .headwear{
    min-height:1480px;
    padding-top:110px
  }

  .headwear-title{
    text-align:right;
    padding-right:4%
  }

  .headwear h2{
    font-size:clamp(68px,7vw,110px)
  }

  .headwear h2 span{
    transform:translateX(-88px)
  }

  .headwear-title>p:last-child{
    margin:24px 0 0 auto;
    font-size:14px
  }

  .headwear-collage{
    height:650px;
    margin:40px auto 0
  }

  .hat-one{
    right:0;
    top:120px;
    width:46%;
    height:450px
  }

  .hat-two{
    left:10%;
    top:0;
    width:27%;
    height:270px
  }

  .hat-three{
    left:24%;
    bottom:0;
    width:31%;
    height:300px
  }

  .cap-feature{
    left:0;
    right:max(30px,calc((100vw - 1220px)/2));
    bottom:0;
    min-height:435px;
    grid-template-columns:58% 42%;
    clip-path:polygon(0 7%,100% 0,100% 100%,0 100%)
  }

  .cap-product{
    height:470px;
    transform:translateY(-54px)
  }

  .cap-product span{
    width:38%;
    height:76%;
    left:8%
  }

  .cap-copy{
    padding:30px 58px 30px 36px
  }

  .cap-copy h3{
    font-size:clamp(52px,4.8vw,74px)
  }

  .cap-copy p{
    margin:22px 0 30px;
    font-size:14px
  }

}


/* =========================================================
   HEADWEAR — TABLET
   ========================================================= */

@media (min-width:481px) and (max-width:900px){

  .headwear{
    min-height:1200px;
    padding-top:110px
  }

  .headwear-title{
    text-align:left;
    padding-right:0
  }

  .headwear h2{
    font-size:51px
  }

  .headwear h2 span{
    transform:translateX(11%)
  }

  .headwear-title>p:last-child{
    margin:24px 0 0 0;
    font-size:13px
  }

  .headwear-collage{
    height:510px;
    margin:38px auto 0
  }

  .hat-one{
    right:0;
    top:100px;
    width:72%;
    height:310px
  }

  .hat-two{
    left:0;
    top:0;
    width:37%;
    height:175px
  }

  .hat-three{
    left:3%;
    bottom:0;
    width:38%;
    height:170px
  }

  .cap-feature{
    left:0;
    right:12px;
    bottom:0;
    grid-template-columns:1fr;
    min-height:0;
    clip-path:polygon(0 4%,100% 0,100% 100%,0 100%)
  }

  .cap-product{
    height:300px;
    transform:translateY(-38px);
    margin-bottom:-38px
  }

  .cap-product span{
    width:34%;
    height:72%;
    left:3%
  }

  .cap-copy{
    padding:26px 24px 52px
  }

  .cap-copy h3{
    font-size:46px
  }

  .cap-copy p{
    font-size:12px;
    margin:17px 0 24px
  }

}


/* =========================================================
   HEADWEAR — MOBILE
   ========================================================= */

@media (max-width:480px){

  .headwear{
    min-height:1200px;
    padding-top:110px
  }

  .headwear-title{
    text-align:left;
    padding-right:0
  }

  .headwear h2{
    font-size:51px
  }

  .headwear h2 span{
    transform:translateX(11%)
  }

  .headwear-title>p:last-child{
    margin:24px 0 0 0;
    font-size:13px
  }

  .headwear-collage{
    height:510px;
    margin:38px auto 0
  }

  .hat-one{
    right:0;
    top:100px;
    width:72%;
    height:285px
  }

  .hat-two{
    left:0;
    top:0;
    width:37%;
    height:155px
  }

  .hat-three{
    left:3%;
    bottom:0;
    width:38%;
    height:150px
  }

  .cap-feature{
    left:0;
    right:12px;
    bottom:0;
    grid-template-columns:1fr;
    min-height:0;
    clip-path:polygon(0 4%,100% 0,100% 100%,0 100%)
  }

  .cap-product{
    height:300px;
    transform:translateY(-38px);
    margin-bottom:-38px
  }

  .cap-product span{
    width:34%;
    height:72%;
    left:3%
  }

  .cap-copy{
    padding:26px 24px 52px
  }

  .cap-copy h3{
    font-size:46px
  }

  .cap-copy p{
    font-size:12px;
    margin:17px 0 24px
  }

}


/* =========================================================
   CONFIDENCE
   ========================================================= */

.confidence{
  background:var(--cream);
  padding:130px max(40px,calc((100vw - 1240px)/2)) 140px;
  display:grid;
  grid-template-columns:34% 66%;
  gap:70px;
  position:relative
}

.confidence:before{
  content:"";
  position:absolute;
  top:0;
  right:max(40px,calc((100vw - 1240px)/2));
  width:180px;
  height:9px;
  background:var(--red);
  transform:rotate(2deg)
}

.confidence h2{
  font-size:clamp(58px,5.5vw,86px);
  color:var(--red-dark)
}

.confidence-grid{
  display:grid;
  grid-template-columns:1fr 1fr
}

.confidence-grid article{
  min-height:190px;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
  padding:22px 26px
}

.confidence-grid article:nth-child(odd){
  border-left:0
}

.confidence-grid article span{
  font-size:10px;
  letter-spacing:.15em;
  color:#8a6f59
}

.confidence-grid h3{
  margin-top:42px;
  font-size:17px
}

.confidence-grid p{
  font-size:11px;
  line-height:1.65;
  margin-top:10px;
  color:var(--muted)
}


/* =========================================================
   FINAL CTA
   ========================================================= */

.final-cta{
  min-height:220px;
  background:var(--red);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  padding:50px max(40px,calc((100vw - 1240px)/2));
  position:relative;
  overflow:hidden
}

.final-cta h2{
  font-size:clamp(46px,4.6vw,72px);
  position:relative;
  z-index:3
}

.final-cta .button{
  position:relative;
  z-index:3;
  min-width:138px
}

.final-cta-ghost{
  position:absolute;
  right:-2vw;
  bottom:-28px;
  font-size:clamp(100px,13vw,210px);
  font-weight:900;
  letter-spacing:-.08em;
  color:rgba(255,255,255,.07);
  white-space:nowrap;
  pointer-events:none
}


/* =========================================================
   DESKTOP HOVER DEPTH
   ========================================================= */

@media (hover:hover) and (pointer:fine){

  .collision-card,
  .shirts figure,
  .mug-stage figure,
  .headwear-collage figure{
    transition:
      transform .4s var(--snap),
      box-shadow .4s var(--ease)
  }

  .conversation-one:hover{
    transform:rotate(-1.4deg) translateY(-8px)
  }

  .conversation-two:hover{
    transform:rotate(2.2deg) translateY(-8px)
  }

  .conversation-three:hover{
    transform:rotate(-3deg) translateY(-8px)
  }

  .shirt-one:hover,
  .mug-one:hover,
  .hat-one:hover{
    transform:translateY(-8px) rotate(0deg)
  }

  .shirt-two:hover,
  .mug-two:hover,
  .hat-two:hover{
    transform:translateY(-8px) rotate(1deg)
  }

  .shirt-three:hover,
  .mug-three:hover,
  .hat-three:hover{
    transform:translateY(-8px) rotate(-1deg)
  }

}


/* =========================================================
   TABLET / MOBILE — OTHER HOMEPAGE SECTIONS
   ========================================================= */

@media (max-width:900px){

  :root{
    --page:min(100% - 36px,680px)
  }

  [data-reveal="left"]{
    --reveal-x:-34px;
    --reveal-y:18px
  }

  [data-reveal="right"]{
    --reveal-x:34px;
    --reveal-y:18px
  }

  [data-reveal="up"]{
    --reveal-y:36px
  }


  .hero{
    min-height:760px
  }

  .hero-grid{
    display:block;
    min-height:720px
  }

  .hero-copy{
    padding:44px 0 8px
  }

  .hero h1{
    font-size:clamp(58px,16.2vw,84px)
  }

  .hero h1 span{
    transform:translateX(12%)
  }

  .hero-intro{
    font-size:13px;
    max-width:370px;
    margin:22px 0 24px
  }

  .hero-visual{
    height:390px;
    padding:16px 0 0 8%;
    justify-content:flex-start
  }

  .hero-visual img{
    width:84%;
    height:350px;
    clip-path:polygon(5% 0,100% 0,96% 95%,0 100%)
  }

  .hero-visual::before{
    right:-18px;
    top:50px;
    width:40%;
    height:315px
  }

  .hero-visual::after{
    left:1%;
    bottom:14px;
    width:92px;
    height:8px
  }

  .hero::before{
    font-size:32vw;
    bottom:8px
  }

  .scroll-cue{
    display:none
  }


  .proof{
    margin-top:-12px;
    padding:86px 0 96px;
    clip-path:polygon(0 3%,100% 0,100% 97%,0 100%)
  }

  .proof-shell{
    display:block
  }

  .proof-title{
    margin-bottom:48px
  }

  .proof-title h2{
    font-size:48px
  }

  .proof-grid{
    grid-template-columns:1fr 1fr
  }

  .proof-grid article{
    min-height:170px;
    padding:18px 12px
  }

  .proof-grid article:nth-child(odd){
    transform:none
  }

  .proof-grid article:nth-child(3){
    border-left:0;
    border-top:1px solid rgba(255,255,255,.16)
  }

  .proof-grid article:nth-child(4){
    border-top:1px solid rgba(255,255,255,.16)
  }

  .proof-grid h3{
    margin-top:30px;
    font-size:14px
  }

  .proof-grid p{
    font-size:10px
  }


  .kinetic-strip{
    height:62px;
    margin:-20px 0 10px
  }

  .kinetic-track{
    font-size:20px;
    gap:24px;
    animation-duration:18s
  }


  .conversation{
    height:800px;
    padding-top:110px
  }

  .conversation-copy{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    padding-right:4%
  }

  .conversation h2{
    font-size:49px
  }

  .conversation-copy>p:last-child{
    font-size:13px;
    margin-top:18px
  }

  .conversation-one{
    left:0;
    top:330px;
    width:70%;
    height:330px
  }

  .conversation-two{
    right:0;
    top:270px;
    width:34%;
    height:190px
  }

  .conversation-three{
    right:4%;
    top:505px;
    width:34%;
    height:180px
  }

  .conversation-block{
    right:-18px;
    bottom:32px;
    width:54%;
    height:180px
  }


  .confidence{
    display:block;
    padding:96px 18px
  }

  .confidence-title,
  .confidence-grid{
    width:var(--page);
    margin:auto
  }

  .confidence-title{
    margin-bottom:48px
  }

  .confidence h2{
    font-size:50px
  }

  .confidence-grid article{
    min-height:180px;
    padding:17px 12px
  }

  .confidence-grid h3{
    margin-top:28px;
    font-size:14px
  }

  .confidence-grid p{
    font-size:10px
  }


  .final-cta{
    min-height:240px;
    display:block;
    padding:54px 18px
  }

  .final-cta h2{
    font-size:46px;
    max-width:500px
  }

  .final-cta .button{
    margin-top:28px
  }

  .final-cta-ghost{
    font-size:28vw;
    bottom:-6px
  }

}


/* =========================================================
   PHONE — OTHER HOMEPAGE SECTIONS
   ========================================================= */

@media (max-width:480px){

  .hero{
    min-height:730px
  }

  .hero-visual{
    height:355px
  }

  .hero-visual img{
    height:320px
  }

  .proof-grid article{
    min-height:160px
  }

  .conversation{
    height:760px
  }

  .conversation-one{
    height:300px
  }

  .conversation-two,
  .conversation-three{
    height:155px
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto
  }

  *,
  *:before,
  *:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important
  }

  [data-reveal]{
    opacity:1!important;
    translate:none!important;
    scale:none!important;
    rotate:none!important
  }

  [data-parallax]{
    --parallax-y:0px!important
  }

}


/* =========================================================
   NATIVE GUTENBERG COMPATIBILITY LAYER
   ========================================================= */

body.whuploo-v3-home #main
.wp-block-group-is-layout-constrained >
:is(.wp-block-group,.wp-block-image,.wp-block-buttons){
  max-width:none!important;
}

body.whuploo-v3-home #main
:where(.wp-block-group,.wp-block-image,.wp-block-buttons){
  box-sizing:border-box;
}

body.whuploo-v3-home #main .wp-block-image img{
  border-radius:0
}


/* Core Image wrappers */

body.whuploo-v3-home .hero-visual > figure.wp-block-image,
body.whuploo-v3-home .shirt-lineup > figure.wp-block-image,
body.whuploo-v3-home .mug-product > figure.wp-block-image,
body.whuploo-v3-home .cap-product > figure.wp-block-image{
  display:contents
}


/* Hero marks */

body.whuploo-v3-home .hero h1 mark{
  background:transparent!important;
  color:var(--red-dark)!important;
  padding:0
}

body.whuploo-v3-home .hero h1 mark:last-of-type{
  display:inline-block;
  color:var(--red)!important;
  transform:translateX(44px)
}


/* Gutenberg Buttons */

body.whuploo-v3-home .wp-block-button.button{
  display:inline-block;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  line-height:normal;
  text-transform:none;
  letter-spacing:normal;
  font-size:inherit;
  font-weight:inherit;
  transform:none
}

body.whuploo-v3-home .wp-block-button.button:hover{
  transform:none;
  box-shadow:none
}

body.whuploo-v3-home
.wp-block-button.button
.wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 26px;
  border:1px solid transparent;
  border-radius:0;
  background-image:none;
  box-sizing:border-box;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  font-weight:600;
  transition:
    transform .24s var(--snap),
    box-shadow .24s var(--ease),
    background .24s var(--ease)
}

body.whuploo-v3-home
.wp-block-button.button
.wp-block-button__link:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 22px rgba(0,0,0,.13)
}

body.whuploo-v3-home
.wp-block-button.button-red
.wp-block-button__link{
  background:var(--red);
  color:#fff
}

body.whuploo-v3-home
.wp-block-button.button-cream
.wp-block-button__link{
  background:var(--cream);
  color:var(--black)
}

body.whuploo-v3-home
.wp-block-button.button-outline
.wp-block-button__link{
  border-color:rgba(255,255,255,.72);
  color:#fff;
  background:transparent
}

body.whuploo-v3-home #main .wp-block-buttons{
  margin:0
}


/* Rounded CTA decision */

body.whuploo-v3-home a.button,
body.whuploo-v3-home
.wp-block-button.button
.wp-block-button__link{
  border-radius:5px
}


/* Number labels */

body.whuploo-v3-home .proof-grid .proof-number{
  margin:0;
  font-size:10px;
  color:#fff6;
  letter-spacing:.16em;
  line-height:normal
}

body.whuploo-v3-home .confidence-grid .confidence-number{
  margin:0;
  font-size:10px;
  letter-spacing:.15em;
  color:#8a6f59;
  line-height:normal
}


/* Figure / caption */

body.whuploo-v3-home #main figure.wp-block-image{
  margin:0
}

body.whuploo-v3-home #main
figure.wp-block-image figcaption{
  margin-left:0;
  margin-right:0
}


/* Final CTA */

body.whuploo-v3-home
.final-cta
.wp-block-buttons{
  position:relative;
  z-index:3;
  flex:0 0 auto
}


@media (max-width:900px){

  body.whuploo-v3-home
  .hero h1 mark:last-of-type{
    transform:translateX(12%)
  }

}


/* =========================================================
   HOMEPAGE IMAGE FRAMES
   ========================================================= */


/* GIFTS THAT START CONVERSATIONS */

body.whuploo-v3-home .conversation-one img{
  border:0 solid #FFF8EE
}

body.whuploo-v3-home .conversation-two img{
  border:5px solid #FFFAF3
}

body.whuploo-v3-home .conversation-three img{
  border:5px solid #FFFAF3
}


/* T-SHIRTS */

body.whuploo-v3-home .shirt-one img{
  border:5px solid #FFFAF3
}

body.whuploo-v3-home .shirt-two img{
  border:5px solid #FFFAF3
}

body.whuploo-v3-home .shirt-lineup img{
  border:5px solid #FFFAF3
}


/* MUGS */

body.whuploo-v3-home .mug-one img{
  border:5px solid #FFFFFF
}

body.whuploo-v3-home .mug-two img{
  border:5px solid #FFFAF3
}

body.whuploo-v3-home .mug-product img{
  border:5px solid #FFFAF3
}


/* HEADWEAR */

body.whuploo-v3-home .hat-one img{
  border:5px solid #FFFAF3
}

body.whuploo-v3-home .hat-two img{
  border:5px solid #FFFAF3
}

body.whuploo-v3-home .cap-product img{
  border:5px solid #FFFAF3
}


/* =========================================================
   BROKEN NEON CTA
   ========================================================= */

body.whuploo-v3-home
.wp-block-button.neon-flicker
.wp-block-button__link{
  position:relative;
  overflow:visible;
  isolation:isolate
}

body.whuploo-v3-home
.wp-block-button.neon-flicker
.wp-block-button__link::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  opacity:0;
  box-shadow:none
}

body.whuploo-v3-home.neon-ready
.wp-block-button.neon-flicker
.wp-block-button__link::after{
  animation:
    whuploo-neon-intro 1.15s 1 0s,
    whuploo-neon-intro 1.15s 1 1.55s
}

body.whuploo-v3-home.neon-ready
.wp-block-button.neon-flicker
.wp-block-button__link{
  animation:
    whuploo-neon-button-dip 1.15s 1 0s,
    whuploo-neon-button-dip 1.15s 1 1.55s
}

body.whuploo-v3-home
.wp-block-button.neon-flicker:hover
.wp-block-button__link::after,

body.whuploo-v3-home
.wp-block-button.neon-flicker
.wp-block-button__link:focus-visible::after{
  animation:whuploo-neon-hover .7s 1
}


@keyframes whuploo-neon-intro{

  0%,
  10%{
    opacity:1;
    box-shadow:
      0 0 4px rgba(194,27,27,.30),
      0 0 10px rgba(194,27,27,.20)
  }

  14%{
    opacity:0;
    box-shadow:none
  }

  20%{
    opacity:1;
    box-shadow:
      0 0 8px rgba(194,27,27,.85),
      0 0 20px rgba(194,27,27,.58),
      0 0 34px rgba(194,27,27,.30)
  }

  26%{
    opacity:0;
    box-shadow:none
  }

  32%{
    opacity:.75;
    box-shadow:
      0 0 5px rgba(194,27,27,.55),
      0 0 14px rgba(194,27,27,.34)
  }

  38%{
    opacity:0;
    box-shadow:none
  }

  45%{
    opacity:1;
    box-shadow:
      0 0 10px rgba(194,27,27,.90),
      0 0 24px rgba(194,27,27,.62),
      0 0 40px rgba(194,27,27,.32)
  }

  55%{
    opacity:.35;
    box-shadow:
      0 0 4px rgba(194,27,27,.28)
  }

  68%{
    opacity:1;
    box-shadow:
      0 0 6px rgba(194,27,27,.55),
      0 0 16px rgba(194,27,27,.34)
  }

  100%{
    opacity:0;
    box-shadow:none
  }

}


@keyframes whuploo-neon-button-dip{

  0%,
  39%,
  100%{
    filter:brightness(1)
  }

  42%{
    filter:brightness(.90)
  }

  46%{
    filter:brightness(1.06)
  }

  50%{
    filter:brightness(1)
  }

}


@keyframes whuploo-neon-hover{

  0%,
  100%{
    opacity:0;
    box-shadow:none
  }

  18%{
    opacity:1;
    box-shadow:
      0 0 7px rgba(194,27,27,.70),
      0 0 18px rgba(194,27,27,.45)
  }

  32%{
    opacity:0;
    box-shadow:none
  }

  45%{
    opacity:1;
    box-shadow:
      0 0 9px rgba(194,27,27,.80),
      0 0 22px rgba(194,27,27,.48)
  }

  65%{
    opacity:.35;
    box-shadow:
      0 0 4px rgba(194,27,27,.25)
  }

}


/* Neon reduced motion */

@media (prefers-reduced-motion:reduce){

  body.whuploo-v3-home.neon-ready
  .wp-block-button.neon-flicker
  .wp-block-button__link,

  body.whuploo-v3-home.neon-ready
  .wp-block-button.neon-flicker
  .wp-block-button__link::after,

  body.whuploo-v3-home
  .wp-block-button.neon-flicker:hover
  .wp-block-button__link::after,

  body.whuploo-v3-home
  .wp-block-button.neon-flicker
  .wp-block-button__link:focus-visible::after{
    animation:none
  }

}


/* =========================================================
   STANDARD CTA FLICKER
   ========================================================= */

body.whuploo-v3-home #main
.wp-block-button.button:not(.neon-flicker)
.wp-block-button__link{
  opacity:1;
  filter:brightness(1)
}

body.whuploo-v3-home #main
.wp-block-button.button.cta-in-view
.wp-block-button__link{
  animation:
    whuploo-cta-flicker .62s 1 0s,
    whuploo-cta-flicker .62s 1 .88s
}

body.whuploo-v3-home #main
.wp-block-button.button.cta-pulse
.wp-block-button__link{
  animation:whuploo-cta-flicker .62s 1
}


@keyframes whuploo-cta-flicker{

  0%,
  100%{
    opacity:1;
    filter:brightness(1)
  }

  14%{
    opacity:.82;
    filter:brightness(.82)
  }

  22%{
    opacity:1;
    filter:brightness(1.10)
  }

  31%{
    opacity:.72;
    filter:brightness(.72)
  }

  39%{
    opacity:1;
    filter:brightness(1.06)
  }

  50%{
    opacity:.88;
    filter:brightness(.88)
  }

  64%{
    opacity:1;
    filter:brightness(1)
  }

}


@media (prefers-reduced-motion:reduce){

  body.whuploo-v3-home #main
  .wp-block-button.button.cta-in-view
  .wp-block-button__link,

  body.whuploo-v3-home #main
  .wp-block-button.button.cta-pulse
  .wp-block-button__link{
    animation:none;
    opacity:1;
    filter:none
  }

}


/* =========================================================
   MOBILE HERO GHOST CROP
   ========================================================= */

@media (max-width:900px){

  body.whuploo-v3-home .hero::before{
    left:0;
    width:100vw;
    max-width:100vw;
    overflow:hidden;
    white-space:nowrap
  }

}


/* =========================================================
   HERO SUPPORTING COPY
   ========================================================= */

body.whuploo-v3-home
.hero-copy
.hero-intro{
  margin-left:0!important;
  margin-right:0!important;
  margin-bottom:20px!important
}


/* =========================================================
   CONVERSATION KICKER
   ========================================================= */

body.whuploo-v3-home
.conversation
.section-kicker{
  margin-bottom:10px!important
}