/* Crochetial storefront refresh. Separate from the original compiled app. */
html { scroll-behavior: smooth; }
body { background: #fbf8f2; --c-ink: #302c24; --c-brand: #75452f; --c-brand-hover: #59331f; --c-ink-3: #756b5e; }
body header { background: #fbf8f2f5 !important; border-bottom: 1px solid #e7ded1 !important; }
body header .container { min-height: 76px; }
body header a[aria-label="Crochetial home"] img { height: 54px !important; }
body .hero-canvas { background: #eee5d7; border-bottom: 1px solid #dfd4c3; }
body .hero-split { padding-top: 56px; padding-bottom: 56px; gap: clamp(24px,5vw,72px); }
body .hero-copy::before { content: "THE CROCHETIAL STUDIO"; display: block; color: #77583f; font-size: 11px; font-weight: 700; letter-spacing: .2em; margin-bottom: 24px; }
body .hero-title { font-size: clamp(2.3rem,4.6vw,4.4rem); letter-spacing: -.045em; line-height: 1.08; max-width: 12ch; margin-bottom: 22px; text-wrap: balance; }
body .hero-sub { line-height: 1.8; max-width: 38ch; color: #665a4b; }
body .hero-ctas { gap: 10px; }
body .hero-ctas button { min-height: 48px; border-radius: 6px !important; padding: 13px 23px !important; }
body .bb-frame, body .bb-frame:hover { transform: none; border-radius: 48% 48% 8px 8px; box-shadow: 0 12px 32px #46332214; border: 8px solid #fbf8f2; }
body .bb-frame img { background: #e9dfce !important; }
body .hero-billboard .bb-frame img { aspect-ratio: 16 / 7 !important; object-fit: cover !important; }
body .hero-billboard { width: min(100%, 720px); }
.r12-price { background: linear-gradient(135deg,#f8efe3,#fffaf4); border:1px solid #dfc9b2; border-radius:14px; display:grid; gap:3px; margin:0 0 16px; padding:14px 17px; }
.r12-price span { color:#8b6248; font-size:10px; font-weight:800; letter-spacing:.14em; }
.r12-price strong { color:#3b2417; font-family:var(--font-display); font-size:1.75rem; }
.r12-price small,.r12-card-price { color:#75452f; font-size:12px; font-weight:700; }
@media (min-width:901px) {
  body .hero-canvas { padding:24px 0; }
  body .hero-split { display:grid !important; grid-template-columns:1fr !important; padding-top:0 !important; padding-bottom:0 !important; max-width:1400px; position:relative; }
  body .hero-copy { align-self:center; grid-column:1; grid-row:1; max-width:42%; padding:46px 0 46px 38px; position:relative; z-index:3; }
  body .hero-billboard { grid-column:1; grid-row:1; margin:0; width:100%; }
  body .bb-frame, body .bb-frame:hover { border:0 !important; border-radius:12px !important; box-shadow:none !important; overflow:hidden; }
  body .hero-billboard .bb-frame img { aspect-ratio:16 / 7 !important; object-fit:cover !important; }
  body .journey { display:none; }
  body .hero-title { font-size:clamp(2.1rem,3.8vw,4rem); }
  body .hero-copy::before { margin-bottom:14px; }
}
body .bb-dots { gap: 4px; bottom: 10px; }
body .bb-dots button { width: 28px; height: 28px; min-height: 28px; background: transparent; position: relative; }
body .bb-dots button::after { content: ""; position: absolute; height: 7px; width: 7px; border-radius: 50%; background: #fbf8f2; left: 10px; top: 10px; box-shadow: 0 0 0 1px #765840; }
body .bb-dots button.on { width: 28px; background: transparent; }
body .bb-dots button.on::after { background: #75452f; }
body .journey { border-top: 1px solid #cdbda6; padding-top: 24px; margin-top: 30px; }
body .j-node { width: 28px; height: 28px; font-size: 11px; }
body .j-line { top: 14px; }
body .j-caption { font-size: 12px; font-weight: 400; }
body .home-section { margin-top: 64px; }
body .home-section h2 { font-size: clamp(1.7rem,3vw,2.4rem); letter-spacing: -.025em; }
/* Photograph-led category navigation, using the recovered collection images. */
body .home-section > div > a[href^="/category/"]:not(:has(img)) { padding: 0 0 17px !important; overflow: hidden; border-radius: 8px !important; background: #fffdf8 !important; transition: transform .2s, box-shadow .2s; }
body .home-section > div > a[href^="/category/"]:not(:has(img))::before { content: ""; display: block; aspect-ratio: 4/3; margin-bottom: 15px; background: #e5dccb var(--collection-image) center / cover no-repeat; }
body .home-section a[href="/category/cardigans"] { --collection-image: url('/cardigans/T01.jpg'); }
body .home-section a[href="/category/tops"] { --collection-image: url('/tops/TT01.jpg'); }
body .home-section a[href="/category/bags"] { --collection-image: url('/bagsnew/B01.jpg'); }
body .home-section a[href="/category/accessories"] { --collection-image: url('/accessories/A01.jpg'); }
body .home-section a[href="/category/kids"] { --collection-image: url('/catalog/bunny-1.jpg'); }
body .home-section a[href="/category/flowers"] { --collection-image: url('/flowers/rose-1.jpg'); }

.phase1-flower-details{margin:2rem 0;padding:clamp(1.25rem,3vw,2rem);border:1px solid #eadfd2;border-radius:22px;background:linear-gradient(145deg,#fffdf9,#f8f0e7);box-shadow:0 14px 34px rgba(91,58,37,.08)}
.phase1-flower-details h3{margin:.35rem 0 .75rem;font-family:"Fraunces",serif;font-size:clamp(1.55rem,3vw,2.25rem);color:#4b281d}
.phase1-flower-details>p{max-width:72ch;line-height:1.75;color:#5f5046}
.phase1-eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.14em;color:#9a5e3d}
.phase1-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin:1.25rem 0}
.phase1-detail-grid div{display:grid;gap:.25rem;padding:1rem;border-radius:15px;background:#fff;border:1px solid #efe4d8}
.phase1-detail-grid strong{color:#4b281d}.phase1-detail-grid span{font-size:.92rem;line-height:1.55;color:#6b5a4e}
.phase1-ideal{padding-top:.75rem;border-top:1px solid #eadfd2}
@media(max-width:640px){.phase1-detail-grid{grid-template-columns:1fr}}
body .home-section a[href="/category/pet-accessories"] { --collection-image: url('/pets/pet-bandana-1.jpg'); }
body .home-section a[href="/category/bed-bath"] { --collection-image: url('/bedbath/boho-bedspread-1.jpg'); }
body .home-section > div > a[href^="/category/"]:not(:has(img)):not([href="/category/cardigans"]):not([href="/category/tops"]):not([href="/category/bags"]):not([href="/category/accessories"]):not([href="/category/kids"]):not([href="/category/flowers"]):not([href="/category/pet-accessories"]):not([href="/category/bed-bath"])::before { background-image: url('/banners/logo-r4.png'); background-size: contain; }
body .grid-cards { gap: 22px; }
body .grid-cards > div:has(a[href^="/products/"]) { border: 1px solid #e6dfd3 !important; border-radius: 8px !important; background: #fffdf8 !important; transition: transform .2s, box-shadow .2s; }
body .grid-cards a[href^="/products/"] > div:first-child { aspect-ratio: 4/5 !important; }
body .grid-cards a[href^="/products/"] img { object-fit: contain !important; background: #eee7db; }
body .grid-cards a[href^="/products/"] > div:nth-child(2) { padding: 17px !important; gap: 12px !important; }
body .grid-cards a[href^="/products/"] > div:nth-child(2) > div:first-child { font-family: var(--font-display); font-size: 1.08rem !important; line-height: 1.4 !important; }

/* Published pricing and cardigan fit guide */
.cg-card-price { color: #74462f; font-size: .92rem; font-weight: 750; margin-top: 3px; }
.cg-live-price { background: linear-gradient(135deg,#f8efe3,#fffaf4); border: 1px solid #dfc9b2; border-radius: 14px; display: grid; gap: 2px; margin: 0 0 18px; padding: 15px 17px; }
.cg-price-kicker,.cg-eyebrow { color: #8b6248; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.cg-live-price strong { color: #3b2417; font-family: var(--font-display); font-size: 1.75rem; line-height: 1.15; }
.cg-price-note { color: var(--c-ink-2); font-size: 12px; }
.cg-size-guide { margin-top: var(--sp-7); max-width: 920px; padding: clamp(18px,3vw,30px); background: #fffaf4; border: 1px solid #e4d3c1; border-radius: var(--r-lg); }
.cg-size-heading { align-items: end; display: flex; justify-content: space-between; gap: 16px; }
.cg-size-heading h3 { margin: 3px 0 0; }
.cg-size-heading > span { color: var(--c-ink-3); font-size: 12px; white-space: nowrap; }
.cg-size-intro,.cg-size-foot { color: var(--c-ink-2); font-size: .9rem; }
.cg-size-table { margin-top: 22px; }
.cg-size-table h4 { font-size: 1rem; margin: 0 0 9px; }
.cg-table-scroll { overflow-x: auto; }
.cg-size-table table { border-collapse: separate; border-spacing: 0; min-width: 620px; width: 100%; }
.cg-size-table th,.cg-size-table td { border-bottom: 1px solid #eadfd3; border-right: 1px solid #eadfd3; padding: 10px 12px; text-align: center; }
.cg-size-table th:first-child,.cg-size-table td:first-child { border-left: 1px solid #eadfd3; }
.cg-size-table thead th { background: #f1e3d4; border-top: 1px solid #eadfd3; color: #4b3022; font-size: .78rem; }
.cg-size-table tbody th { background: #fff; color: #74462f; }
.cg-size-table tbody td { background: #fff; }
@media (max-width: 620px) { .cg-size-heading { align-items: flex-start; flex-direction: column; gap: 4px; } .cg-size-guide { margin-left: -4px; margin-right: -4px; padding: 16px 12px; } }

body a:focus-visible, body button:focus-visible { outline: 3px solid #75452f; outline-offset: 4px; }
@media (hover:hover) {
 body .grid-cards > div:has(a[href^="/products/"]):hover,
 body .home-section > div > a[href^="/category/"]:hover { transform: translateY(-3px); box-shadow: 0 9px 25px #302c2410; }
}
@media(max-width:900px) {
 body .hero-split { padding-top: 30px; padding-bottom: 34px; gap: 28px; }
 body .hero-billboard { order: 0; width: min(100%,440px); margin: auto; }
 body .hero-title { max-width: 17ch; margin-left: auto; margin-right: auto; }
 body .hero-copy::before { margin-bottom: 16px; }
 body .hero-sub { margin-left: auto; margin-right: auto; }
 body .journey { max-width: 380px; }
}
@media(max-width:640px) {
 body .container { padding-left: 20px; padding-right: 20px; }
 body header .container { min-height: 68px; }
 body .hero-title { font-size: 2.6rem; }
 body .hero-sub { font-size: .95rem; }
 body .hero-ctas a { flex: 1; }
 body .hero-ctas button { width: 100%; font-size: .83rem !important; padding: 12px 8px !important; }
 body .home-section { margin-top: 44px; }
 body .grid-cards { gap: 12px; }
 body .grid-cards a[href^="/products/"] > div:nth-child(2) { padding: 12px !important; }
 body .grid-cards a[href^="/products/"] > div:nth-child(2) > div:first-child { font-size: .95rem !important; }
 body .home-section > div:has(> a[href^="/category/"]) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
 body .bb-frame { border-width: 6px; }
}
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior: auto; }
 body .bb-frame *, body .j-node, body .grid-cards > div, body .home-section a { transition: none !important; animation: none !important; }
}
/* Notifications enter from the top, on desktop and mobile. */
body .crw-overlay {
 align-items: flex-start;
 padding: max(84px, env(safe-area-inset-top)) 16px 16px;
 overflow-y: auto;
}
body .crw-card {
 border-radius: 18px;
 max-height: calc(100dvh - 104px);
 overflow-y: auto;
 animation: crochetialNoticeDown .28s ease-out;
}
body .crw-chip {
 top: max(84px, env(safe-area-inset-top));
 bottom: auto;
 right: 16px;
 max-width: calc(100vw - 32px);
 animation: crochetialNoticeDown .28s ease-out;
}
body #root div[style*="position: fixed"]:has(> [role="status"]) {
 top: max(84px, env(safe-area-inset-top)) !important;
 bottom: auto !important;
}
body #root div[style*="position: fixed"] > [role="status"] {
 animation: crochetialNoticeDown .25s ease-out;
}
@keyframes crochetialNoticeDown {
 from { opacity: 0; transform: translateY(-24px); }
 to { opacity: 1; transform: translateY(0); }
}
@media(prefers-reduced-motion:reduce) {
 body .crw-card, body .crw-chip,
 body #root div[style*="position: fixed"] > [role="status"] { animation: none; }
}

/* Preserve the complete original collection artwork without an arch crop. */
body .bb-frame, body .bb-frame:hover { border-radius: 12px; }
.r9-cardigan-details,.r9-cardigan-gallery{max-width:1180px;margin:34px auto;padding:28px;border:1px solid #eadfce;border-radius:18px;background:#fffaf3;color:#332a25}.r9-cardigan-details>span{font-size:.75rem;letter-spacing:.16em;color:#9a664d;font-weight:700}.r9-cardigan-details h2,.r9-cardigan-gallery h2{font-family:Fraunces,serif;margin:8px 0 12px}.r9-cardigan-details>p{font-size:1.05rem;line-height:1.75;max-width:820px}.r9-cardigan-details>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}.r9-cardigan-details>div p{margin:0;padding:16px;background:#fff;border-radius:12px;line-height:1.55}.r9-cardigan-details strong{display:block;color:#7c4d39;margin-bottom:5px}.r9-cardigan-gallery>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.r9-cardigan-gallery img{width:100%;aspect-ratio:1/1.15;object-fit:cover;border-radius:12px;background:#f3ede5}@media(max-width:760px){.r9-cardigan-details,.r9-cardigan-gallery{margin:22px 12px;padding:20px}.r9-cardigan-details>div{grid-template-columns:1fr}.r9-cardigan-gallery>div{grid-template-columns:repeat(2,minmax(0,1fr))}}
