/* Patas do Bem: a visual language from the supplied campaign artwork. */
@font-face{font-family:Anton;src:url('assets/fonts/anton-400.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/fonts/dm-sans-400.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/fonts/dm-sans-600.woff') format('woff');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/fonts/dm-sans-700.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:Caveat;src:url('assets/fonts/caveat-600.woff') format('woff');font-style:normal;font-weight:600;font-display:swap}
:root{
  --paper:#ffffff;--white:#ffffff;--ink:#252f30;--teal:#007f84;--deep:#00666b;
  --muted:#536b6c;--mint:#d9f0ed;--sand:#f0f8f6;--coral:#e9866c;--line:#cce4e0;
  --sans:'DM Sans',Arial,sans-serif;--display:Anton,'Arial Narrow',sans-serif;
  --hand:Caveat,cursive;--serif:var(--sans);
}
body{font-family:var(--sans)}
em{font-family:inherit;font-style:normal;font-weight:inherit;color:var(--teal)}
.handwritten{font:600 32px/1.08 var(--hand);text-transform:none;letter-spacing:0}
.eyebrow{font-size:11px;letter-spacing:1.9px;font-weight:700}
.button{font-size:14px;gap:20px;padding:16px 24px}
.button-small{font-size:13px;padding:11px 19px;gap:10px}
.link-action{font-size:14px;font-weight:600}
.site-header{background:#fffffff2;border-color:#d3e9e570}
.header-inner{height:96px}
.site-header nav{font-size:13px;font-weight:600}
.selection-button span{background:var(--mint);font-size:10px}
.hero{position:relative;grid-template-columns:1fr 1fr;gap:46px;min-height:730px;padding-block:48px 80px}
.hero .eyebrow{font-size:11px;letter-spacing:1px}
.hero h1{font:400 clamp(95px,10.2vw,147px)/1.02 var(--display);text-transform:uppercase;letter-spacing:-1.6px;margin:25px 0 5px}
.hero h1 em{font:inherit;letter-spacing:inherit;display:block;line-height:1.02}
.hero-signature{font-size:31px;color:var(--teal);margin:14px 0 24px;transform:rotate(-3deg);transform-origin:left center;white-space:nowrap}
.hero-lead{font-size:15px;line-height:1.8;max-width:365px}
.hero-actions{gap:22px;margin-top:29px}
.hero-shop-note{font-size:12px;margin-top:33px;gap:13px}
.note-heart{background:var(--mint);font-size:30px;width:43px;height:43px}
.hero-scene{height:585px;isolation:isolate}
.hero-blob{inset:35px -28px 24px 8px;background:#bce3df;border-radius:41% 59% 44% 56% / 53% 36% 64% 47%;transform:rotate(-11deg);z-index:-2}
.hero-blob::after{content:'';position:absolute;inset:30px -23px -10px 28px;border:1px solid #96cdc8;border-radius:60% 40% 60% 40%;transform:rotate(22deg)}
.love-line{display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:var(--teal);pointer-events:none}
.hero-love-line{position:absolute;inset:-27px -35px -20px -45px;width:calc(100% + 80px);height:calc(100% + 47px);z-index:-1;overflow:visible;opacity:.75}
.portrait-main{right:4%;top:28px;width:65%;height:86%;transform:rotate(3deg);border-radius:47% 47% 24px 24px;padding:7px 7px 0;box-shadow:0 22px 44px #005b5e1a}
.portrait-main .portrait-window{border-radius:46% 46% 18px 18px}
.portrait-side{width:43%;height:58%;left:-2%;bottom:36px;padding:7px 7px 0;transform:rotate(-8deg);border-radius:22px;box-shadow:0 15px 35px #005b5e24}
.portrait-side .portrait-window{border-radius:16px 16px 7px 7px}
.portrait figcaption{height:64px;padding:11px 10px}
.portrait figcaption strong{font:400 25px/1.1 var(--display);text-transform:uppercase;letter-spacing:.3px;color:var(--ink)}
.portrait figcaption span{font-size:11px;letter-spacing:0}
.portrait-side figcaption{height:73px}
.hero-handwriting{top:5px;left:-8px;font-size:35px;line-height:.98;transform:rotate(-9deg);max-width:150px}
.scene-paw{color:var(--teal);opacity:.22;width:62px;height:62px;left:47%;bottom:0}
.lives-stamp{right:-10px;bottom:-2px;width:132px;height:132px;background:var(--teal);transform:rotate(8deg);box-shadow:0 0 0 7px white}
.lives-stamp strong{font:400 66px/.95 var(--display);letter-spacing:0}
.lives-stamp span{font-size:10px;line-height:1.4;max-width:110px}
.brand-strip{padding:17px 0;background:var(--teal);transform:rotate(-1.5deg)}
.brand-strip>div{gap:42px}
.brand-strip span{font:400 30px/1.1 var(--display);letter-spacing:1.8px}
.brand-strip i{font:400 37px/1 var(--sans);color:#b6e2df}
.history h2,.section-intro h2,.shop-intro h2,.donation-copy h2,.closing h2{font:400 70px/1.04 var(--display);text-transform:uppercase;letter-spacing:-.5px}
.history h2 em{line-height:1.04}
.history{padding-top:130px;gap:90px}
.history-doodle .handwritten{font-size:32px}
.history-story{background:var(--sand);border-radius:34px 34px 6px 34px;padding:38px 38px 32px;box-shadow:none}
.history-story::before{display:none}
.chapter{font-size:11px;letter-spacing:1.2px;color:var(--teal)}
.story-opening{font:600 34px/1.08 var(--hand);margin:20px 0;color:var(--teal)}
.history-story>p:not(.story-opening){font-size:14px;line-height:1.85}
.history-dates strong{font:400 42px/1 var(--display);letter-spacing:0}
.history-dates span{font-size:11px}
.animals-section{background:#e8f6f3;border-radius:55px 55px 0 0;overflow:hidden}
.section-intro{position:relative;isolation:isolate}
.section-intro>div,.section-intro>p{position:relative;z-index:1}
.section-intro>p{font-size:14px;line-height:1.85}
.section-love-line{position:absolute;right:5%;top:-65px;width:330px;height:132px;opacity:.22;z-index:0}
.filter{font-size:13px;font-weight:600;padding:11px 19px}
.search-field span{font-size:11px}
.search-field input{font-size:14px}
.animal-card{border-radius:26px;box-shadow:none}
.animal-info h3{font:400 37px/1.1 var(--display);text-transform:uppercase;letter-spacing:.1px;margin:10px 0 13px}
.animal-info .eyebrow{font-size:10px}
.animal-info>p:not(.eyebrow){font-size:14px;line-height:1.75}
.animal-facts span{background:var(--sand);border-radius:6px;font-size:11px}
.profile-trigger{font-size:13px;font-weight:600}
.animal-photo-placeholder{background:var(--mint)}
.placeholder-heart{font:65px/1 var(--sans)}
.animal-photo-placeholder>span:last-child{font-size:11px}
.shop-section{position:relative;background:white}
.shop-intro{gap:75px;margin-bottom:75px;grid-template-columns:.85fr 1.15fr}
.shop-intro h2{font-size:112px;letter-spacing:-1px;margin:20px 0 25px}
.shop-intro>div>p:not(.eyebrow){font-size:15px;line-height:1.85;max-width:355px}
.campaign-photo{height:510px;transform:none;border-radius:140px 24px 140px 24px;background:#d6ece8;box-shadow:14px 14px 0 #d9f0ed;isolation:isolate}
.campaign-photo svg{position:relative;z-index:0}
.campaign-caption{background:#ffffffed;border-radius:8px;font-size:29px;line-height:1.15;padding:13px 18px;bottom:23px;left:23px;right:23px;transform:rotate(-2deg)}
.campaign-caption i{font-size:31px}
.product-photo{background:#f3f9f7;border-radius:24px}
.product-kind{font-size:11px;letter-spacing:1.3px}
.product-card h3{font:700 17px/1.4 var(--sans);letter-spacing:-.2px;min-height:48px}
.product-detail,.product-select{font-size:13px}
.product-select{font-weight:600}
.catalog-note{font-size:13px}
.donation-section{background:var(--teal);color:white;border-radius:55px 55px 0 0}
.donation-copy h2{font-size:66px;line-height:1.08;margin:23px 0 25px;letter-spacing:0}
.donation-copy h2 em{color:#c0efea}
.donation-copy .eyebrow{color:#cbefeb}
.donation-copy>p:not(.eyebrow){font-size:15px;color:#e1f4f0;max-width:400px}
.donation-value>span{font-size:12px}
.donation-value strong{font:400 102px/1.1 var(--display);letter-spacing:0}
.donation-value strong span{font-size:14px;margin-left:14px}
.donation-copy .monthly-note{font-size:13px!important}
.pix-card{transform:none;background:white;border-radius:30px;padding:35px 32px 25px;box-shadow:11px 11px 0 #ffffff16}
.pix-heart{font:48px/1 var(--sans)}
.pix-card .eyebrow{font-size:11px}
.pix-card h3{font:400 42px/1.12 var(--display);text-transform:uppercase;letter-spacing:0}
.pix-card>p:not(.eyebrow){font-size:13px;max-width:290px}
.pix-card label{font-size:12px}
.pix-card input{background:var(--sand);font-size:16px;padding:14px 8px}
.pix-card .pix-feedback{font-size:12px!important}
.closing{position:relative;padding-block:105px 95px;isolation:isolate}
.closing-love-line{width:240px;height:96px;position:absolute;left:-35px;top:57px;opacity:.35;z-index:-1}
.closing .handwritten{font:600 35px/1.1 var(--hand);margin-bottom:22px;transform:rotate(-3deg)}
.closing h2{font-size:64px;line-height:1.07;letter-spacing:0}
.closing .button{font-size:13px}
.site-footer p,.site-footer>span{font-size:12px}
.dialog-heading,#selection-title{font:400 42px/1.1 var(--display);text-transform:uppercase;letter-spacing:0}
.dialog-facts span{font-size:11px}
.product-dialog-photo{background:var(--sand)}
.product-fields input{border-color:var(--line)}
#selection-actions>p{font-size:12px}
@media(min-width:1500px){.hero{min-height:760px}.hero-scene{height:610px}}
@media(max-width:1120px){
  .hero{gap:35px;min-height:675px}.hero h1{font-size:118px;letter-spacing:-1px}.hero-signature{font-size:27px}.hero-scene{height:540px}
  .hero-actions{gap:14px;flex-wrap:wrap}.hero-actions .button{font-size:13px}.hero-shop-note{font-size:11px}
  .hero-handwriting{font-size:30px}.lives-stamp{width:115px;height:115px;right:-3px}.lives-stamp strong{font-size:56px}
  .history{gap:50px}.history h2{font-size:61px}.section-intro h2{font-size:61px}.shop-intro{gap:52px}.shop-intro h2{font-size:92px}
  .campaign-photo{height:450px}.donation-copy h2{font-size:57px}.pix-card{padding-inline:25px}
}
@media(max-width:900px){
  .header-inner{gap:20px}.site-header nav{gap:18px;font-size:12px}.header-actions{gap:10px}
  .hero{gap:25px;min-height:620px}.hero h1{font-size:clamp(74px,10.6vw,99px)}.hero-signature{font-size:24px}.hero .eyebrow{font-size:10px;letter-spacing:.5px}.hero-lead{font-size:14px}
  .hero-scene{height:470px}.hero-handwriting{font-size:27px}.portrait figcaption strong{font-size:22px}.portrait figcaption span{font-size:11px}.portrait-side figcaption{height:78px}
  .lives-stamp{width:103px;height:103px;right:-10px}.lives-stamp strong{font-size:50px}.lives-stamp span{font-size:9px}.hero-blob{inset:40px -10px 20px 5px}
  .hero-love-line{inset:-22px -18px -20px -20px;width:calc(100% + 38px);height:calc(100% + 42px)}
  .history h2{font-size:54px}.history-story{padding-inline:28px}.history-story>p:not(.story-opening){font-size:13px}.history-dates strong{font-size:36px}
  .section-intro h2{font-size:55px}.section-intro>p{font-size:13px}.shop-intro{gap:38px}.shop-intro h2{font-size:83px}.campaign-photo{height:395px}.campaign-caption{font-size:25px}
  .donation-copy h2{font-size:49px}.donation-copy>p:not(.eyebrow){font-size:14px}.donation-value strong{font-size:90px}.pix-card h3{font-size:35px}.pix-card input{font-size:14px}
  .closing h2{font-size:56px}
}
@media(max-width:700px){
  .header-inner{height:83px}.site-header .brand{width:138px}.button-small{font-size:12px;padding:10px 13px}.site-header nav{font-size:14px}
  .hero{padding-block:37px 55px;gap:43px;grid-template-columns:1fr;min-height:0}.hero-copy{text-align:center}.hero .eyebrow{font-size:10px;letter-spacing:.4px}
  .hero h1{font-size:clamp(80px,23vw,134px);line-height:1.01;letter-spacing:-1px;margin:24px 0 6px}.hero h1 em{line-height:1.01;letter-spacing:inherit}
  .hero-signature{font-size:28px;white-space:normal;transform:rotate(-3deg);transform-origin:center;margin:16px 0 22px}
  .hero-lead{font-size:14px;max-width:335px}.hero-actions{margin-top:24px;gap:18px}.hero-actions .button{font-size:13px;padding:15px 20px}.hero-actions .link-action{font-size:13px}
  .hero-shop-note{font-size:11px;margin-top:24px;text-align:left}.note-heart{width:38px;height:38px}
  .hero-scene{height:475px;width:min(420px,calc(100% - 24px));margin:auto}.hero-blob{inset:32px -16px 24px -7px}
  .hero-love-line{inset:-25px -25px -20px -27px;width:calc(100% + 52px);height:calc(100% + 45px)}
  .portrait-main{width:64%;height:85%;right:2%;top:22px}.portrait-side{width:44%;height:58%;left:-2%;bottom:35px}
  .portrait figcaption{height:62px;padding:10px 7px}.portrait figcaption strong{font-size:23px}.portrait figcaption span{font-size:11px}.portrait-side figcaption{height:73px}
  .hero-handwriting{font-size:29px;top:0;left:-5px}.lives-stamp{width:108px;height:108px;right:-7px;bottom:0}.lives-stamp strong{font-size:53px}.lives-stamp span{font-size:9px}
  .scene-paw{width:53px;height:53px;bottom:0;left:45%}.brand-strip{padding:16px 0}.brand-strip>div{gap:25px}.brand-strip span{font:400 25px/1.1 var(--display);letter-spacing:1px}.brand-strip i{font-size:30px}
  .history{padding-top:80px;gap:35px}.history h2{font-size:58px;line-height:1.04;letter-spacing:0}.history-doodle .handwritten{font-size:30px}
  .history-story{padding:31px 26px 29px}.story-opening{font-size:33px}.history-story>p:not(.story-opening){font-size:14px}.history-dates strong{font-size:36px}.history-dates span{font-size:11px}
  .animals-section,.donation-section{border-radius:34px 34px 0 0}.section-intro h2{font-size:57px;line-height:1.04;letter-spacing:0}.section-intro>p{font-size:14px}.section-love-line{right:-75px;top:-55px;width:255px;opacity:.13}
  .animal-info h3{font-size:37px;letter-spacing:0}.animal-info>p:not(.eyebrow){font-size:14px}.animal-info .eyebrow{font-size:10px}.profile-trigger{font-size:13px}.filter{font-size:13px;padding:10px 16px}
  .shop-intro{gap:37px;margin-bottom:50px}.shop-intro h2{font-size:94px;letter-spacing:-.5px;margin:18px 0 25px}.shop-intro>div>p:not(.eyebrow){font-size:14px;max-width:330px}.shop-intro .link-action{font-size:14px}
  .campaign-photo{width:min(430px,calc(100% - 18px));height:390px;border-radius:100px 20px 100px 20px;box-shadow:9px 9px 0 var(--mint)}.campaign-caption{font-size:26px;left:16px;right:16px;bottom:19px;padding:12px 14px}
  .product-photo{border-radius:20px}.product-kind{font-size:10px}.product-card h3{font-size:15px;letter-spacing:-.2px;line-height:1.4;min-height:44px}.product-detail,.product-select{font-size:12px}.catalog-note{font-size:12px}
  .selection-link{font-size:12px;gap:7px}.donation-copy h2{font-size:53px;letter-spacing:0;line-height:1.08}.donation-copy>p:not(.eyebrow){font-size:14px}.donation-value strong{font-size:94px;letter-spacing:0}.donation-value strong span{font-size:13px}.donation-value>span{font-size:12px}
  .pix-card{padding:31px 25px 24px}.pix-card h3{font-size:39px}.pix-card input{font-size:15px}.pix-card label{font-size:11px}.pix-card>p:not(.eyebrow){font-size:13px}
  .closing{padding-block:75px}.closing .handwritten{font-size:31px}.closing h2{font-size:46px;letter-spacing:0}.closing .button{font-size:12px}.closing-love-line{width:160px;height:64px;left:-55px;top:25px;opacity:.2}
  .site-footer p,.site-footer>span{font-size:11px}.dialog-heading,#selection-title{font-size:36px;letter-spacing:0}
}
@media(max-width:390px){
  .site-header .brand{width:115px}.button-small{font-size:11px;padding-inline:11px}.header-actions{gap:7px}
  .hero h1{font-size:clamp(70px,23vw,90px)}.hero-signature{font-size:25px}.hero .eyebrow{font-size:10px;letter-spacing:0}.hero-lead{font-size:14px}
  .hero-actions{gap:13px}.hero-actions .button{font-size:12px;padding:14px 17px;gap:12px}.hero-actions .link-action{font-size:12px}
  .hero-scene{height:430px;width:calc(100% - 18px)}.hero-handwriting{font-size:25px}.portrait figcaption strong{font-size:21px}.portrait figcaption span{font-size:11px}.portrait-side figcaption{height:76px}
  .lives-stamp{width:98px;height:98px}.lives-stamp strong{font-size:47px}.lives-stamp span{font-size:9px}.history h2{font-size:53px}.section-intro h2{font-size:51px}
  .history-story{padding-inline:23px}.history-dates strong{font-size:33px}.history-dates span{font-size:10px}.shop-intro h2{font-size:86px}.campaign-photo{height:340px}.campaign-caption{font-size:23px}
  .catalog-heading{flex-wrap:wrap;gap:16px}.product-card h3{font-size:14px;min-height:44px}.product-select{font-size:12px;gap:4px}.donation-copy h2{font-size:47px}.closing h2{font-size:40px}
}
/* Three approved designs, each with a colour choice and WhatsApp order. */
.product-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.product-photo{height:340px}
.product-kind{margin-top:20px}
.product-card h3{min-height:0}
.collection-colors{font-size:13px;color:var(--muted);margin-top:6px}
.product-colors{font-size:12px;color:var(--teal);margin-top:11px;line-height:1.6}
.product-card .product-select{gap:10px}
.product-fields .product-color-field{grid-column:1/-1;max-width:none}
.product-fields select{display:block;width:100%;min-width:0;margin-top:7px;padding:11px 10px;border:1px solid var(--line);border-radius:6px;background:var(--white);color:var(--ink);font:16px/1.4 var(--sans)}
.product-fields label{font-size:13px}
.product-color-field select:focus-visible{outline:3px solid #bd6549;outline-offset:4px}
.product-fields{gap:18px 16px}
.photo-reference{font-size:11px!important;margin:-8px 0 15px;color:var(--muted)}
.order-contact{color:var(--teal);font-weight:600}
.continue-shopping{display:block;padding:14px 0 4px;text-align:center;text-decoration:underline;font-size:13px;color:var(--teal)}
.footer-contact{font-size:12px;line-height:1.9;color:var(--teal)}
.footer-contact span{font-weight:600}
.selection-row>div{min-width:0;overflow-wrap:anywhere}
@media(max-width:1120px){.product-photo{height:300px}}
@media(max-width:900px){.product-list{gap:25px 20px}.product-photo{height:270px}.product-colors{font-size:11px}.product-card h3{font-size:15px}.product-card .product-select{font-size:12px}}
@media(max-width:700px){.product-list{grid-template-columns:1fr;max-width:430px;margin-inline:auto;gap:36px}.product-photo{height:365px}.product-card h3{font-size:19px}.product-kind{font-size:11px}.product-colors,.product-detail,.product-card .product-select{font-size:13px}.product-card .product-select{padding:14px 0}.collection-colors{font-size:12px}.catalog-heading{gap:20px;align-items:center}.footer-contact{font-size:11px}.product-fields label{font-size:12px}}
@media(max-width:390px){.product-photo{height:320px}.catalog-heading{flex-wrap:nowrap;gap:12px}.catalog-heading .eyebrow{font-size:10px;letter-spacing:1px}.collection-colors{font-size:11px}}
/* Current shirts on models: complete portraits in the catalogue, print details in the dialog. */
.campaign-photo{height:auto;aspect-ratio:3/2;border-radius:80px 22px 80px 22px}
.product-photo{height:auto;aspect-ratio:5/8;background:var(--white)}
.product-dialog-photo{height:auto;aspect-ratio:1}
@media(max-width:700px){.campaign-photo{height:auto;aspect-ratio:3/2;border-radius:65px 20px 65px 20px}.campaign-caption{font-size:24px;left:14px;right:14px;bottom:14px;padding:10px 13px}.product-photo{height:auto;aspect-ratio:5/8}.product-dialog-photo{height:auto;aspect-ratio:1}}
@media(max-width:390px){.campaign-caption{font-size:21px}.product-photo{height:auto}}