/* Wattle Pixel Co — Site V2 Premium visual system
   21 Sep 2026
   Purpose: reduce cream fatigue, increase contrast and rhythm, preserve forest/gold identity. */

:root{
  --v2-canvas:#f4f6f3;
  --v2-paper:#ffffff;
  --v2-soft:#eaf0ec;
  --v2-soft-2:#eef2ef;
  --v2-cream:#f1e8db;
  --v2-green:#154734;
  --v2-deep:#0c3327;
  --v2-gold:#c7a65a;
  --v2-gold-soft:#ead8a7;
  --v2-ink:#18342a;
  --v2-muted:#62716b;
  --v2-line:rgba(21,71,52,.13);
  --v2-shadow:0 18px 48px rgba(20,49,39,.08);
  --v2-shadow-lg:0 28px 80px rgba(20,49,39,.11);
}

html,body{background:var(--v2-canvas)!important;color:var(--v2-ink)!important}
.site-header,header.site-header{background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--v2-line)!important;backdrop-filter:blur(18px)}
.site-mobile-menu{background:rgba(255,255,255,.985)!important}
.topline{background:var(--v2-deep)!important}
footer{background:var(--v2-deep)!important}
.btn.primary{background:var(--v2-green)!important;color:#fff!important}
.btn.gold{background:var(--v2-gold-soft)!important;color:var(--v2-deep)!important}
.wpc-text-link,.text-link{color:var(--v2-green)!important}
.kicker,.eyebrow{color:#a6812d!important}
img{image-rendering:auto}

/* shared editorial surfaces */
.v2-surface-white{background:var(--v2-paper)!important}
.v2-surface-soft{background:var(--v2-soft)!important}
.v2-surface-cream{background:var(--v2-cream)!important}

/* HOME */
.page-home .hero{background:linear-gradient(180deg,#fff 0%,#f8faf8 100%)!important}
.page-home .statement{background:var(--v2-deep)!important}
.page-home .make{background:var(--v2-paper)!important}
.page-home .books-feature{background:var(--v2-soft)!important}
.page-home .digital{background:var(--v2-paper)!important;border-color:var(--v2-line)!important}
.page-home .play{background:linear-gradient(145deg,#0f3c2e,#173f35)!important}
.page-home .studio{background:var(--v2-soft-2)!important}
.page-home .pixel-note{background:var(--v2-paper)!important;border-top:1px solid var(--v2-line)}
.page-home .make-card,.page-home .book-card{background:#fff!important;box-shadow:0 12px 34px rgba(20,49,39,.045)!important}
.page-home .hero-image{background:#e9eeea!important}

/* PRODUCTS */
.page-products .products-hero{background:linear-gradient(180deg,#fff 0%,#f5f8f5 100%)!important}
.page-products .products-intro{background:var(--v2-soft)!important;padding-top:70px!important}
.page-products .products-list{background:var(--v2-soft)!important}
.page-products .product-family-card{background:#fff!important;box-shadow:var(--v2-shadow)!important}
.page-products .product-family-card:nth-child(4n+2),.page-products .product-family-card:nth-child(4n+3){background:#fff!important}

/* software portfolio */
.v2-software{padding:78px 0 86px;background:#fff;border-top:1px solid var(--v2-line);border-bottom:1px solid var(--v2-line)}
.v2-software-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:end;margin-bottom:30px}
.v2-software-head h2{margin:0;color:var(--v2-green);font:400 clamp(42px,4.6vw,64px)/.98 var(--wpc-serif);letter-spacing:-.045em}
.v2-software-head p{max-width:620px;margin:0;color:var(--v2-muted);font-size:14px;line-height:1.75}
.v2-software-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.v2-product{display:flex;min-height:310px;flex-direction:column;padding:20px;border:1px solid var(--v2-line);border-radius:20px;background:#fff;box-shadow:0 12px 32px rgba(20,49,39,.045)}
.v2-product-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.v2-product-top small{color:#9d7d34;font-size:8px;font-weight:850;letter-spacing:.15em;text-transform:uppercase}
.v2-status{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid var(--v2-line);border-radius:999px;color:#36584c;font-size:8px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:#f8faf8}
.v2-status:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--v2-gold)}
.v2-product-mark{display:grid;width:78px;height:78px;place-items:center;margin:24px auto 17px;border-radius:20px;background:#f5f7f5;border:1px solid rgba(21,71,52,.08);box-shadow:0 10px 24px rgba(20,49,39,.055)}
.v2-product-mark img{max-width:54px;max-height:54px;width:auto;height:auto;object-fit:contain}
.v2-product--commute .v2-product-mark img{display:block;width:54px;height:54px;border-radius:13px;object-fit:cover}
.v2-product h3{margin:0;color:var(--v2-green);font:400 28px/1.02 var(--wpc-serif);letter-spacing:-.035em;text-align:center}
.v2-product p{margin:10px 0 0;color:var(--v2-muted);font-size:11.5px;line-height:1.65}
.v2-product-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:18px}
.v2-product-footer a{font-size:10px;font-weight:800;color:var(--v2-green)}
.v2-product-footer span{font-size:8.5px;color:#829089}

/* PIXEL NOTE */
.page-pixel-note .pixel-note-hero{background:linear-gradient(180deg,#fff 0%,#f5f8f5 100%)!important}
.page-pixel-note .pixel-note-categories a{background:#fff!important;box-shadow:0 12px 32px rgba(20,49,39,.045)!important}
.page-pixel-note .note-featured{background:var(--v2-soft)!important}
.page-pixel-note .note-featured-card{background:#fff!important;box-shadow:var(--v2-shadow)!important}
.page-pixel-note .note-archive{background:#fff!important}
.page-pixel-note .note-card{background:#fff!important;box-shadow:0 10px 26px rgba(20,49,39,.035)}
.page-pixel-note .note-subscribe{background:var(--v2-soft)!important}
.page-pixel-note-article .article-hero{background:linear-gradient(180deg,#fff 0%,#f5f8f5 100%)!important}
.page-pixel-note-article .article-body{background:#fff}
.page-pixel-note-article .article-callout{background:var(--v2-soft)!important}

/* ABOUT */
.page-about{background:var(--v2-canvas)!important}
.page-about .hero{background:#fff!important}
.page-about .story{background:var(--v2-soft)!important}
.page-about .principles{background:#fff!important;box-shadow:0 12px 34px rgba(20,49,39,.045)}
.page-about .formats{background:var(--v2-deep)!important;color:#fff!important;border:0!important}
.page-about .formats h2,.page-about .format strong{color:#fff!important}
.page-about .formats .kicker,.page-about .format .n{color:var(--v2-gold-soft)!important}
.page-about .format-list{border-top-color:rgba(255,255,255,.16)!important}
.page-about .format{border-bottom-color:rgba(255,255,255,.13)!important}
.page-about .format p{color:#cbd8d2!important}
.page-about .values{background:#fff!important}
.page-about .value{background:#fff!important;box-shadow:0 12px 34px rgba(20,49,39,.04)}
.page-about .value b{background:var(--v2-soft)!important}
.page-about .future{background:#fff!important}
.page-about .future-shell{background:var(--v2-soft)!important}
.page-about .future-visual{background:linear-gradient(145deg,#dfe8e2,#f5f7f5)!important}
.page-about .note{background:var(--v2-soft)!important}

/* DIGITAL SERVICES */
.page-digital-services{background:var(--v2-canvas)!important}
.page-digital-services .hero{background:#fff!important}
.page-digital-services .service-value{background:var(--v2-deep)!important;color:#fff!important}
.page-digital-services .service-value h2{color:#fff!important}
.page-digital-services .service-value h2 em{color:var(--v2-gold-soft)!important}
.page-digital-services .service-value p{color:#d3dfda!important}
.page-digital-services .section{background:#fff}
.page-digital-services .packages{background:var(--v2-soft)!important}
.page-digital-services .package,.page-digital-services .care-card,.page-digital-services .direction,.page-digital-services .form-card{background:#fff!important;box-shadow:var(--v2-shadow)!important}
.page-digital-services .process{background:var(--v2-deep)!important;color:#fff!important}
.page-digital-services .process .section-head h2{color:#fff!important}
.page-digital-services .process .section-head p{color:#cbd8d2!important}
.page-digital-services .process .step{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.14)!important}
.page-digital-services .process .step h3{color:#fff!important}
.page-digital-services .process .step p{color:#cbd8d2!important}
.page-digital-services .enquiry{background:var(--v2-soft)!important}

/* CONTACT + LEGAL */
.page-contact .hero{background:#fff!important}
.page-contact .contact{background:var(--v2-soft)!important}
.page-legal{background:var(--v2-canvas)!important}
.page-legal .policy-card,.page-legal .legal-card{background:#fff!important;box-shadow:var(--v2-shadow)!important}

/* Better readable text */
.page-about .format p,.page-about .values-head p,.page-about .story-copy p,
.page-products .foundation-heading>p,.page-pixel-note .note-card p{opacity:1!important}

/* Responsive */
@media(max-width:1100px){
  .v2-software-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){
  .v2-software-head{grid-template-columns:1fr;gap:18px}
}
@media(max-width:620px){
  .v2-software{padding:58px 0 64px}
  .v2-software-grid{grid-template-columns:1fr}
  .v2-product{min-height:0}
}

/* Keep cream as an accent, never the whole canvas. */

/* Homepage product identity — precise assets, one consistent carrier */
.v2-hero-products{position:absolute;left:28px;bottom:24px;z-index:8;display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid rgba(21,71,52,.1);border-radius:18px;background:rgba(255,255,255,.92);box-shadow:0 16px 40px rgba(20,49,39,.13);backdrop-filter:blur(14px)}
.v2-hero-products__label{padding:0 8px;color:#315f50;font-size:8px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.v2-hero-products__mark{display:grid;width:45px;height:45px;place-items:center;border:1px solid rgba(21,71,52,.08);border-radius:13px;background:#f5f7f5}
.v2-hero-products__mark img{max-width:31px;max-height:31px;width:auto;height:auto;object-fit:contain}

.page-about .future-shell{grid-template-columns:minmax(0,.92fr) minmax(470px,1.08fr)!important}
.page-about .future-visual{min-height:500px;padding:38px 28px;overflow:hidden;isolation:isolate}
.page-about .future-visual:before{right:7%;top:11%;width:34px;height:34px;border-radius:9px;background:linear-gradient(145deg,#d5bd73,#a98635);box-shadow:-420px 350px 0 -6px #bfa35b;opacity:.9}
.page-about .future-visual:after{display:none}
.v2-about-constellation{position:relative;z-index:2;display:grid;width:min(100%,510px);grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.v2-about-product{position:relative;overflow:hidden;display:flex!important;width:auto!important;height:auto!important;min-height:136px;flex-direction:column;align-items:center;justify-content:center;padding:17px 16px 15px;border:1px solid rgba(21,71,52,.10)!important;border-radius:24px!important;background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(248,251,249,.94))!important;box-shadow:0 18px 44px rgba(20,49,39,.09),inset 0 1px 0 rgba(255,255,255,.95)!important}
.v2-about-product:before{content:"";position:absolute;inset:-35% auto -35% -60%;width:42%;transform:rotate(14deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);opacity:.42;transition:left .65s ease}
.v2-about-product:hover:before{left:120%}
.v2-about-mark{display:grid!important;width:64px!important;height:64px!important;place-items:center;border:1px solid rgba(21,71,52,.08)!important;border-radius:18px!important;background:linear-gradient(145deg,#f8faf8,#eef2ef)!important;box-shadow:0 9px 22px rgba(20,49,39,.06)!important}
.v2-about-mark img{max-width:46px!important;max-height:46px!important;width:auto!important;height:auto!important;object-fit:contain}
.v2-about-product__copy{display:block!important;width:auto!important;height:auto!important;margin-top:10px!important;border:0!important;background:transparent!important;box-shadow:none!important;text-align:center}
.v2-about-product__copy strong{display:block;color:#154734;font-size:12px;line-height:1.2;font-weight:800}
.v2-about-product__copy small{display:block;margin-top:4px;color:#7a8781;font-size:7.5px;line-height:1.2;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.v2-about-constellation .hub{position:relative;overflow:hidden;grid-column:1/-1;justify-self:center;display:grid!important;width:min(82%,390px)!important;height:auto!important;min-height:96px;grid-template-columns:64px 1fr;align-items:center;justify-content:start;gap:14px;padding:15px 20px!important;border:1px solid rgba(21,71,52,.11)!important;border-radius:24px!important;background:linear-gradient(145deg,#fff,#f7faf8)!important;box-shadow:0 20px 50px rgba(20,49,39,.10),inset 0 1px 0 rgba(255,255,255,.98)!important}
.v2-about-constellation .hub:after{content:"";position:absolute;left:22%;right:22%;top:0;height:2px;background:linear-gradient(90deg,transparent,#c7a65a,transparent)}
.v2-about-constellation .hub img{max-width:50px!important;max-height:50px!important;width:auto!important;height:auto!important;object-fit:contain}
.v2-about-constellation .hub>span{display:block!important;width:auto!important;height:auto!important;border:0!important;background:transparent!important;box-shadow:none!important}
.v2-about-constellation .hub strong{display:block;color:#154734;font:600 19px/1 var(--wpc-serif);text-align:left}
.v2-about-constellation .hub small{display:block;margin-top:5px;color:#77847e;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.09em}
@media(max-width:1000px){
  .page-about .future-shell{grid-template-columns:1fr!important}
  .page-about .future-visual{min-height:470px}
  .v2-about-constellation{width:min(92%,540px)}
}
@media(max-width:560px){
  .page-about .future-visual{min-height:0;padding:28px 18px 34px}
  .v2-about-constellation{width:100%;gap:10px}
  .v2-about-product{min-height:124px;padding:14px 10px 13px;border-radius:20px!important}
  .v2-about-mark{width:58px!important;height:58px!important;border-radius:16px!important}
  .v2-about-mark img{max-width:42px!important;max-height:42px!important}
  .v2-about-product__copy strong{font-size:10.5px}
  .v2-about-constellation .hub{width:88%!important;min-height:86px;grid-template-columns:54px 1fr;padding:13px 16px!important}
  .v2-about-constellation .hub img{max-width:44px!important;max-height:44px!important}
  .v2-about-constellation .hub strong{font-size:17px}
}

@media(max-width:760px){
  .v2-hero-products{left:14px;right:14px;bottom:14px;justify-content:center}
  .v2-hero-products__label{display:none}
}


/* Site V2 interaction polish */
.v2-product,.product-family-card,.note-card,.service-card-v2,.website-example-v2,.value,.care-card,.package{
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.v2-product:hover,.product-family-card:hover,.note-card:hover,.service-card-v2:hover,.website-example-v2:hover,.value:hover,.care-card:hover,.package:hover{
  transform:translateY(-3px);
  border-color:rgba(199,166,90,.34)!important;
  box-shadow:0 20px 48px rgba(20,49,39,.085)!important;
}
a,.btn,button,input,select,textarea{
  transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid rgba(199,166,90,.42);
  outline-offset:3px;
}
.btn:hover{transform:translateY(-2px)}
.v2-product-footer a,.wpc-text-link,.text-link{ text-underline-offset:5px; }
.v2-product-footer a:hover,.wpc-text-link:hover,.text-link:hover{ text-decoration:underline; text-decoration-color:var(--v2-gold); }

@media(prefers-reduced-motion:reduce){
  .v2-product,.product-family-card,.note-card,.service-card-v2,.website-example-v2,.value,.care-card,.package,
  a,.btn,button,input,select,textarea{transition:none!important;transform:none!important}
}


/* Site V2 flagship homepage hero */
.v2-home-hero{padding:88px 0 84px;background:linear-gradient(180deg,#fff 0%,#f4f7f4 100%);border-bottom:1px solid var(--v2-line)}
.v2-home-hero__shell{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(430px,.98fr);gap:56px;align-items:center;padding:58px;border:1px solid rgba(21,71,52,.10);border-radius:36px;background:linear-gradient(135deg,#f8fbf9 0%,#eef3ef 100%);box-shadow:0 26px 80px rgba(20,49,39,.08)}
.v2-home-hero__shell:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-130px;top:-120px;border:1px solid rgba(21,71,52,.06);box-shadow:0 0 0 54px rgba(21,71,52,.025),0 0 0 108px rgba(21,71,52,.015)}
.v2-home-hero__shell:after{content:"";position:absolute;width:34px;height:34px;right:7%;top:11%;border-radius:9px;background:linear-gradient(145deg,#d5bd73,#a98635);box-shadow:-560px 500px 0 -5px #bfa35b}
.v2-home-hero__copy{position:relative;z-index:2}
.v2-home-hero__copy .kicker{margin-bottom:18px}
.v2-home-hero__copy h1{max-width:720px;margin:0;color:var(--v2-green);font:400 clamp(64px,6.8vw,98px)/.93 var(--wpc-serif);letter-spacing:-.052em}
.v2-home-hero__copy .lead{max-width:650px;margin:26px 0 0;color:#52635c;font-size:17px;line-height:1.75}
.v2-home-hero__actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:28px}
.v2-home-hero__meta{margin-top:34px;color:#718079;font-size:9px;font-weight:800;letter-spacing:.19em;text-transform:uppercase}
.v2-home-hero__ecosystem{position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:center}
.v2-home-product{display:flex;min-height:164px;flex-direction:column;align-items:center;justify-content:center;padding:20px;border:1px solid rgba(21,71,52,.09);border-radius:26px;background:rgba(255,255,255,.92);box-shadow:0 18px 44px rgba(20,49,39,.08)}
.v2-home-product__mark{display:grid;width:78px;height:78px;place-items:center;border-radius:20px;background:#f5f7f5;border:1px solid rgba(21,71,52,.08)}
.v2-home-product__mark img{max-width:56px;max-height:56px;width:auto;height:auto;object-fit:contain}
.v2-home-product strong{margin-top:12px;color:var(--v2-green);font-size:13px}
.v2-home-product span{margin-top:3px;color:#78857f;font-size:8px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.v2-home-hub{grid-column:1/-1;display:grid;grid-template-columns:64px 1fr;gap:15px;align-items:center;min-height:102px;padding:18px 20px;border:1px solid rgba(21,71,52,.1);border-radius:24px;background:#fff;box-shadow:0 18px 44px rgba(20,49,39,.07)}
.v2-home-hub__mark{display:grid;width:64px;height:64px;place-items:center;border-radius:17px;background:#f5f7f5;border:1px solid rgba(21,71,52,.08)}
.v2-home-hub__mark img{max-width:46px;max-height:46px;width:auto;height:auto;object-fit:contain}
.v2-home-hub strong{display:block;color:var(--v2-green);font:600 22px/1 var(--wpc-serif)}
.v2-home-hub span{display:block;margin-top:5px;color:#7b8882;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}

@media(max-width:1050px){
  .v2-home-hero__shell{grid-template-columns:1fr;gap:38px;padding:44px}
  .v2-home-hero__ecosystem{max-width:720px;width:100%;justify-self:center}
}
@media(max-width:650px){
  .v2-home-hero{padding:48px 0 54px}
  .v2-home-hero__shell{padding:26px 20px;border-radius:24px}
  .v2-home-hero__copy h1{font-size:clamp(52px,15vw,68px)}
  .v2-home-hero__ecosystem{grid-template-columns:1fr 1fr;gap:10px}
  .v2-home-product{min-height:142px;padding:15px;border-radius:20px}
  .v2-home-product__mark{width:64px;height:64px}
  .v2-home-product__mark img{max-width:46px;max-height:46px}
  .v2-home-hub{grid-template-columns:54px 1fr;padding:14px 16px}
  .v2-home-hub__mark{width:54px;height:54px}
  .v2-home-hero__meta{line-height:1.7}
}