:root {
  --cream:#fff7e9;
  --paper:#fffcf5;
  --peach:#ffcfba;
  --red:#a71724;
  --wine:#801525;
  --ink:#44252b;
  --muted:#68434a;
  --line:#ebc9b9;
  --display:"Chewy","Cooper Black","Segoe Print",cursive;
  --body:"Nunito","Trebuchet MS",sans-serif;
  color:var(--ink);
  background:var(--cream);
  font:17px/1.58 var(--body);
}
*,*::before,*::after {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:86px}
body,figure {margin:0}
img {display:block;max-width:100%;height:auto}
a {color:var(--red);text-underline-offset:.2em}
button,input,select,textarea {font:inherit}
button {cursor:pointer}
[hidden] {display:none!important}
:focus-visible {outline:3px solid #523b8f;outline-offset:4px}
h1,h2,h3,p {margin:0}
.wrap {width:min(1180px, calc(100% - 88px));margin-inline:auto}
.section {padding-block:90px}
.skip-link {position:fixed;top:12px;left:12px;z-index:8;transform:translateY(-150%);background:var(--paper);padding:12px 18px}
.skip-link:focus {transform:none}
.top {position:sticky;top:0;z-index:5;background:var(--paper);border-bottom:1px solid #edd7c6}
.top-inner,.brand,.menu,.actions {display:flex;align-items:center}
.top-inner {min-height:76px;justify-content:space-between;gap:18px}
.brand {gap:9px;text-decoration:none;flex:none}
.brand-icon {width:43px;height:39px;object-fit:contain}
.brand-name {width:156px;height:auto}
.menu {gap:clamp(20px,3.1vw,43px)}
.menu a,.footer a {color:var(--ink);text-decoration:none;font-size:.92rem;font-weight:800}
.menu a:hover,.footer a:hover {color:var(--red);text-decoration:underline}
.menu .menu-contact {border:1px solid var(--red);border-radius:50px;padding:8px 16px;color:var(--red)}
.menu-contact span {padding-left:4px}
.menu-toggle {background:var(--cream);border:1px solid var(--red);border-radius:28px;color:var(--red);font-weight:900;padding:6px 13px}
.menu-toggle span {margin-left:4px}
.hero {background:#ffe0cd;position:relative;isolation:isolate}
.hero::before,.contact-card::before {
  content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23a)' opacity='.26' d='M0 0h160v160H0z'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;opacity:.25;
}
.awning {position:absolute;inset:0 0 auto;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='18' viewBox='0 0 88 18'%3E%3Cpath fill='%23ae212c' d='M0 0h44v5c0 8-8 12-22 12S0 13 0 5z'/%3E%3Cpath fill='%23f6ad9d' d='M44 0h44v5c0 8-8 12-22 12S44 13 44 5z'/%3E%3C/svg%3E") repeat-x center top}
.hero-inner {display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:30px;padding-block:64px 62px;min-height:568px}
.eyebrow {color:var(--wine);font-size:.7rem;font-weight:900;letter-spacing:.15em;line-height:1.4;text-transform:uppercase}
.eyebrow span {font-size:1rem;letter-spacing:0;margin-right:4px;vertical-align:-.05em}
h1,.section-title,h3 {font-family:var(--display);font-weight:400;color:var(--red)}
h1 {font-size:clamp(3.1rem,6.35vw,6.5rem);line-height:.99;letter-spacing:.002em;margin:13px 0 19px}
.hero-description {max-width:425px;font-size:1.05rem;line-height:1.54}
.actions {gap:12px;flex-wrap:wrap;margin-top:24px}
.button {display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:10px 18px;background:var(--red);color:var(--paper);border:1px solid var(--red);border-radius:40px;font-size:.9rem;font-weight:900;text-decoration:none;line-height:1.25;transition:background .18s,color .18s,transform .18s}
.button:hover {background:var(--wine);color:#fff;transform:translateY(-2px)}
.button--outline {background:transparent;color:var(--red)}
.button--outline:hover {background:var(--red);color:var(--paper)}
.button span {font-size:1.12em}
.hero-art {position:relative;min-width:0;justify-self:stretch;padding:5px 46px 0 36px}
.hero-art::before {content:"";position:absolute;z-index:-1;inset:8% 1% 0 4%;background-color:#efab9f;background-image:radial-gradient(#b3293438 1px,transparent 1.5px);background-size:11px 11px;border-radius:48% 52% 44% 56% / 55% 48% 52% 45%;transform:rotate(-8deg)}
.hero-photo {position:relative;margin-inline:auto;background:var(--paper);padding:12px 12px 9px;max-width:400px;transform:rotate(4deg);border:1px solid #f2d2bb;box-shadow:5px 9px 0 #81323a25}
.hero-photo > img {width:100%;aspect-ratio:1;object-fit:cover;background:#eee3d7;border-radius:3px}
.hero-photo figcaption {display:flex;justify-content:space-between;gap:8px;padding:5px 6px 0;font:400 1.26rem/1.2 var(--display);color:var(--red)}
.tape {position:absolute;z-index:1;width:30%;height:30px;left:34%;top:-15px;transform:rotate(-10deg);background:repeating-linear-gradient(90deg,#f8bb9ba1 0 2px,#ffc6a8b0 2px 5px);clip-path:polygon(0 4%,100% 0,97% 25%,100% 47%,98% 68%,100% 98%,0 100%,3% 77%,0 61%,3% 37%)}
.hero-sparkle {position:absolute;top:3%;right:0;z-index:1;width:clamp(36px,5vw,62px);height:auto}
.hero-loop {position:absolute;bottom:0;left:0;color:var(--red);width:clamp(65px,9vw,116px);height:auto;transform:rotate(-12deg)}
.mascot-sticker {position:absolute;z-index:2;bottom:-3%;right:0;transform:rotate(-10deg);filter:drop-shadow(0 4px 1px #6c263c36);width:30%;max-width:138px}
.mascot-sticker img {width:100%;filter:drop-shadow(3px 0 #fff6e8) drop-shadow(-3px 0 #fff6e8) drop-shadow(0 -3px #fff6e8) drop-shadow(0 3px #fff6e8)}
.ribbon {background:var(--red);color:#fff3df;border-block:4px double #ffe1c982}
.ribbon-inner {display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px clamp(16px,4vw,55px);min-height:47px;padding-block:5px;font:400 clamp(.98rem,1.55vw,1.27rem)/1.25 var(--display)}
.ribbon b {color:#ffc4a5;font-weight:400}
.creations {background:var(--cream)}
.section-heading {display:flex;justify-content:space-between;align-items:end;gap:20px 42px;margin-bottom:34px}
.section-heading > p {max-width:385px;padding-bottom:3px}
.section-title {font-size:clamp(2.55rem,4.85vw,4.3rem);line-height:1.02;margin-top:8px}
.products {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.product {display:flex;flex-direction:column;min-width:0;background:var(--paper);border:1px solid #e8c6b4;border-radius:14px;padding:9px;box-shadow:0 4px 0 #e8c6b470}
.product-photo {position:relative;background:#f6c0a7;border-radius:8px;overflow:hidden}
.product-photo img {width:100%;height:auto;aspect-ratio:1.16;object-fit:cover}
.product--silkyes img {object-position:50% 45%}
.product--bookmarks img {object-position:center}
.product-photo span {position:absolute;bottom:9px;left:9px;border-radius:20px;background:#fff9ed;color:var(--wine);font-size:.59rem;line-height:1.25;letter-spacing:.095em;font-weight:900;padding:6px 9px}
.product-body {padding:12px 9px 10px;display:flex;flex:1;flex-direction:column}
.product h3 {font-size:1.96rem;line-height:1.05}
.product p {font-size:.9rem;line-height:1.47;margin:7px 0 13px}
.product a,.inline-link {display:inline-flex;gap:8px;align-items:center;font-size:.87rem;font-weight:900;align-self:start}
.product a {margin-top:auto}
.product a:hover,.inline-link:hover {color:var(--wine)}
.questions {background:var(--paper)}
.questions-inner {display:grid;grid-template-columns:minmax(245px,.7fr) minmax(0,1.3fr);gap:35px 64px}
.questions-inner > div:first-child > p:not(.eyebrow) {margin:14px 0 12px}
.answers {border-top:1px solid var(--line)}
.answers details {border-bottom:1px solid var(--line)}
.answers summary {min-height:56px;display:flex;justify-content:space-between;align-items:center;gap:16px;list-style:none;cursor:pointer;padding:12px 8px 12px 0;color:var(--wine);font-weight:900}
.answers summary::-webkit-details-marker {display:none}
.answers summary::after {content:"+";flex:none;font:400 1.45rem/1 var(--display)}
.answers details[open] summary::after {content:"−"}
.answers details > p {font-size:.94rem;padding:0 20px 16px 0;overflow-wrap:anywhere}
.contact {background:#f9d3c2}
.contact-card {position:relative;isolation:isolate;background:var(--paper);border:1px solid #e4b09e;border-radius:24px;box-shadow:0 6px 0 #b43d3d20;display:grid;grid-template-columns:1fr 1fr;gap:36px 58px;padding:clamp(24px,5vw,64px)}
.contact-intro {align-self:center}
.contact-intro > p:not(.eyebrow) {margin:14px 0 21px;max-width:365px}
.contact-address {font-size:clamp(.94rem,1.55vw,1.18rem);font-weight:900;overflow-wrap:anywhere}
.copy-row {display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:9px;font-size:.79rem;color:var(--muted)}
.copy-email {background:transparent;border:1px dashed #ae5556;border-radius:25px;color:var(--wine);font-weight:800;padding:5px 10px}
.copy-email:hover {background:#ffe8dc}
.contact-form {display:grid;gap:7px;min-width:0}
.contact-form label {font-size:.89rem;font-weight:900}
.contact-form select,.contact-form textarea {width:100%;min-height:44px;padding:9px 11px;background:#fff9ef;border:1px solid #ce9c8f;border-radius:9px;color:var(--ink)}
.contact-form label[for="texto"] {margin-top:5px}
.contact-form textarea {resize:vertical}
.contact-form button {justify-self:start;margin-top:6px}
.form-note {font-size:.77rem;line-height:1.4;color:var(--muted)}
.footer {background:var(--paper);padding-top:27px}
.footer-main,.footer-note,.footer nav {display:flex;align-items:center;flex-wrap:wrap}
.footer-main,.footer-note {justify-content:space-between;gap:12px 24px}
.footer nav {gap:10px 24px}
.footer-note {border-top:1px solid var(--line);margin-top:22px;padding-block:14px;font-size:.78rem;color:var(--muted)}
.footer-note a {font-size:inherit}
@media(max-width:980px) {
  .wrap {width:calc(100% - 56px)}
  .hero-inner {min-height:0;padding-block:64px 56px}
  .hero-art {padding-inline:23px 28px}
  .products {grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-photo img {aspect-ratio:1.47}
  .section {padding-block:72px}
}
@media(max-width:680px) {
  html {scroll-padding-top:74px}
  .wrap {width:calc(100% - 34px)}
  .top-inner {min-height:64px;flex-wrap:wrap;gap:4px 9px;padding-block:9px}
  .brand-icon {width:36px;height:32px}
  .brand-name {width:135px}
  .menu {width:100%;flex-wrap:wrap;gap:7px 15px;padding:8px 0 4px}
  .menu a {font-size:.84rem}
  .menu .menu-contact {padding:4px 9px}
  .hero-inner {grid-template-columns:1fr;gap:28px;padding-block:48px 36px}
  h1 {font-size:clamp(2.8rem,10.5vw,4.2rem);margin-bottom:14px}
  .hero-description {font-size:.98rem}
  .actions {margin-top:19px;gap:9px}
  .button {min-height:44px;padding-inline:14px;font-size:.86rem}
  .hero-art {width:min(90%,385px);justify-self:center;padding-inline:30px}
  .hero-photo {padding:8px 8px 6px}
  .hero-photo figcaption {font-size:1rem}
  .hero-sparkle {right:0}
  .ribbon-inner {justify-content:center;gap:4px 10px;padding-block:9px}
  .ribbon-inner span:last-child,.ribbon-inner b:nth-last-child(2) {display:none}
  .section {padding-block:53px}
  .section-heading {display:block;margin-bottom:23px}
  .section-heading > p {margin-top:10px}
  .products {gap:11px}
  .product {padding:6px}
  .product-photo img {aspect-ratio:1.1}
  .product-photo span {left:5px;bottom:5px;padding:4px 6px;font-size:.53rem}
  .product-body {padding:9px 4px 5px}
  .product h3 {font-size:1.57rem}
  .product p,.product a {font-size:.81rem}
  .questions-inner,.contact-card {grid-template-columns:1fr;gap:23px}
  .contact-card {padding:21px}
  .footer-main {align-items:flex-start;flex-direction:column}
}
@media(max-width:355px) {
  .products {grid-template-columns:1fr}
  .hero-break {display:none}
  .ribbon-inner {font-size:.86rem}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {scroll-behavior:auto!important;transition:none!important}
}
