/* Approved Bezhy identity, scoped to the existing public catalogue/account flows. */
.bezhy-public {
    --color-sage: #A9C8A0;
    --color-blush: #E8C5C8;
    --color-cream: #FDF8F3;
    --color-olive: #5D7A5B;
    --color-rose: #D89DA6;
    --color-gold: #D4B572;
    --color-ink: #263A2B;
    --color-white: #FFFFFF;
    --bezy-almond: var(--color-blush);
    --bezy-pistachio: var(--color-sage);
    --bezy-ink: var(--color-ink);
    --bezy-muted: var(--color-olive);
    --bezy-paper: var(--color-white);
    --bezy-soft: var(--color-cream);
    --bezy-accent-ink: var(--color-olive);
    --bezy-line: rgb(93 122 91 / .25);
    --bezy-shadow: 0 16px 48px rgb(38 58 43 / .06);
    --cream: var(--color-cream);
    --paper: var(--color-white);
    --blush: var(--color-blush);
    --rose: var(--color-olive);
    --sage: var(--color-olive);
    --gold: var(--color-gold);
    --ink: var(--color-ink);
    --muted: var(--color-olive);
    --line: var(--bezy-line);
    --shadow: var(--bezy-shadow);
    --project-ink: var(--color-ink);
    --project-muted: var(--color-olive);
    --project-line: var(--bezy-line);
    --project-rose: var(--color-olive);
    --project-rose-soft: var(--color-blush);
    --project-sage: var(--color-olive);
    --project-sage-soft: var(--color-sage);
    --project-gold: var(--color-gold);
    --font-body: "Montserrat", Inter, Arial, sans-serif;
    --font-display: "Playfair Display", "Noto Serif Display", Georgia, serif;
    background: var(--color-cream);
    color: var(--color-ink);
    font-family: var(--font-body);
    min-height: 100vh;
}
.bezhy-public :where(button, input, select, textarea, .menu-tabs button, .dock-action > span) { font-family: var(--font-body) !important; }
.bezhy-public :where(h1, h2, h3) { font-family: var(--font-display); }
.bezhy-public :where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--color-ink); outline-offset: 4px; }
.bezhy-public .website-credit { display: grid; grid-column: 1 / -1; justify-items: center; inline-size: 100%; margin-block-start: 8px; padding-block-start: 20px; border-block-start: 1px solid rgb(253 248 243 / .22); text-align: center; }
.bezhy-public .website-credit-link { display: inline-grid; justify-items: center; gap: 7px; padding: 4px 10px; color: inherit; text-decoration: none; }
.bezhy-public footer .website-credit-link:focus-visible { outline-color: var(--color-white); }
.bezhy-public .website-credit-label { color: var(--color-gold); font-size: .72rem; font-weight: 600; line-height: 1.4; letter-spacing: .16em; text-transform: uppercase; }
.bezhy-public .website-credit-logo { display: block; inline-size: 132px; block-size: auto; }
.bezhy-public :where(input, select, textarea) { border-radius: 10px; font-size: 16px; }
.bezhy-public :where(.button, .status-button, .auth-panel button, .account-actions > a, .empty-orders a) {
    background: var(--color-ink) !important;
    border-color: var(--color-ink) !important;
    border-radius: 999px;
    color: var(--color-white) !important;
    min-height: 44px;
    font-size: 13px;
    letter-spacing: 0;
}
.bezhy-public :where(.button, .status-button, .auth-panel button):hover { background: var(--color-olive) !important; color: var(--color-white) !important; }
.bezhy-public .announcement { background: var(--color-sage) !important; color: var(--color-ink) !important; letter-spacing: .02em; flex-wrap: wrap; }
.bezhy-public .announcement a { color: var(--color-ink) !important; }
.bezhy-public :where(.site-header, .account-header) { background: var(--color-cream) !important; gap: 24px; }
.bezhy-public .bezhy-wordmark { display: block; width: 180px; max-width: 100%; height: auto; object-fit: contain; }
.bezhy-public .bezhy-header-logo { display: block; width: 148px; max-width: 100%; height: auto; max-height: 86px; object-fit: contain; }
.bezhy-public :where(.brand, .account-brand, .status-brand) { flex: 0 0 auto; }
.bezhy-public .site-header nav { display: flex; gap: 22px; }
.bezhy-public .site-header nav a { white-space: nowrap; }
.bezhy-public .hero { min-height: 570px; gap: 55px; }
.bezhy-public .hero::before { display: none; }
.bezhy-public .hero h1 { font-size: clamp(42px, 4.4vw, 70px); line-height: 1.12; }
.bezhy-public :where(h1, h2) em { font-style: normal; }
.bezhy-public .bezhy-signature-panel {
    border-radius: 48% 48% 28px 28px;
    background: var(--color-blush);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 54px 20px 36px;
    min-height: 360px;
}
.bezhy-public .bezhy-signature-panel > img { display: block; width: min(100%, 350px); height: auto; object-fit: contain; }
.bezhy-public .bezhy-signature-panel > p { color: var(--color-ink); text-align: center; font: 500 25px/1.4 var(--font-display); }
.bezhy-public .bezhy-story-art {
    min-height: 320px;
    border-radius: 28px;
    padding: 42px;
    background: var(--color-sage) url('/brand/bezhy/06_Patterns/bezhy-macaron-repeat.svg') repeat;
    background-size: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.bezhy-public .bezhy-story-art > img { width: 88px; height: 88px; }
.bezhy-public .bezhy-story-art > p { background: var(--color-cream); padding: 18px 24px; border-radius: 20px; color: var(--color-ink); text-align: center; font: 500 26px/1.4 var(--font-display); }
.bezhy-public :where(.hero-copy > p, .story-copy > p, .product-copy p, .section-heading > p) { font-size: 15px; line-height: 1.8; }
.bezhy-public :where(.product-card, .steps-grid, .status-card, .builder-panel, .reference-upload, .account-prompt) { border-radius: 20px; overflow: hidden; }
.bezhy-public :where(.product-copy strong, .product-copy a, .product-copy .add-product) { font-size: 14px; }
.bezhy-public :where(.product-copy a, .product-copy .add-product) { min-width: 44px; min-height: 44px; border-radius: 50%; }
.bezhy-public .product-image span { font-size: 11px; letter-spacing: .02em; }
.bezhy-public .product-image-empty { display: grid; place-items: center; background: #FDF8F3; }
.bezhy-public .product-image .product-no-photo { width: 64px; height: 64px; object-fit: contain; }
.bezhy-public .add-product:disabled { opacity: .45; cursor: not-allowed; }
.bezhy-public .order-card { background: var(--color-sage) !important; color: var(--color-ink) !important; border-radius: 28px; }
.bezhy-public .order-card :where(p, .light, h2 em) { color: var(--color-ink); }
.bezhy-public .order-card .button-outline { background: transparent !important; color: var(--color-ink) !important; }
.bezhy-public .order-drawer { background: var(--color-cream) !important; }
.bezhy-public .order-form :where(input, select, textarea) { font-size: 16px; min-width: 0; }
.bezhy-public .order-form label > span { font-size: 12px; letter-spacing: .03em; }
.bezhy-public :where(.form-note, .cart-summary > p, .cart-line, .cart-total) { font-size: 13px; }
.bezhy-public .order-form small { font-size: 12px; line-height: 1.5; }
.bezhy-public :where(.storefront-footer, .marketing-footer, .account-header ~ footer) { background: var(--color-ink); color: var(--color-white); }
.bezhy-public :where(.storefront-footer, .marketing-footer) :where(a, small) { color: var(--color-white); }
.bezhy-public .footer-group a { font-size: 13px; line-height: 1.6; }
.bezhy-public .account-header ~ footer .bezhy-wordmark { margin: 0 auto; }
.bezhy-public .auth-intro { background: var(--color-sage) !important; color: var(--color-ink) !important; }
.bezhy-public .auth-intro :where(p, h1 em) { color: var(--color-ink); }
.bezhy-public .project-help { background: var(--color-blush) !important; color: var(--color-ink) !important; }
.bezhy-public .project-help a { color: var(--color-ink); }
.bezhy-public .status-contact, .bezhy-public .payment-note, .bezhy-public .order-summary > div { font-size: 13px; }
.bezhy-public .status-top p { font-size: 15px; }
.bezhy-public .status-pills span { font-size: 11px; }
.bezhy-public .order-details :where(small, b) { font-size: 12px; }
.bezhy-public .dock-action { border-radius: 50%; background: var(--color-white); color: var(--color-ink); }
.bezhy-public .dock-action > img { width: 25px; height: 25px; }
.bezhy-public .dock-whatsapp { background: var(--color-ink) !important; color: var(--color-white) !important; }
.bezhy-public .dock-action:not(.dock-whatsapp):hover, .bezhy-public .dock-action:not(.dock-whatsapp):focus-visible { background: var(--color-cream) !important; color: var(--color-ink) !important; }
.bezhy-public :where(#menu, #order, #story) { scroll-margin-top: 110px; }

@media (max-width: 1100px) {
    .bezhy-public .site-header { gap: 18px; padding-inline: 4%; }
    .bezhy-public .site-header nav { gap: 14px; font-size: 12px; }
    .bezhy-public .header-actions { gap: 9px; }
    .bezhy-public .hero { gap: 40px; }
}
@media (max-width: 960px) {
    .bezhy-public .site-header { height: auto; min-height: 84px; padding-block: 10px; flex-wrap: wrap; }
    .bezhy-public .site-header nav { order: 3; flex-basis: 100%; justify-content: space-between; overflow-x: auto; }
    .bezhy-public .site-header nav a { padding: 8px 0; }
    .bezhy-public .site-header nav a::after { bottom: 3px; }
    .bezhy-public .hero { min-height: auto; }
    .bezhy-public .bezhy-signature-panel { max-width: 540px; width: 100%; justify-self: center; }
    .bezhy-public .account-header nav { display: flex; gap: 15px; }
    .bezhy-public :where(#menu, #order, #story) { scroll-margin-top: 150px; }
}
@media (max-width: 700px) {
    .bezhy-public { padding-bottom: 88px; }
    .bezhy-public .bezhy-wordmark { width: 138px; }
    .bezhy-public .bezhy-header-logo { width: 110px; max-height: 66px; }
    .bezhy-public .header-actions .button { font-size: 12px; padding-inline: 13px; }
    .bezhy-public .hero-actions { flex-wrap: wrap; gap: 20px; }
    .bezhy-public .bezhy-signature-panel { min-height: 310px; padding: 35px 20px 22px; }
    .bezhy-public .bezhy-signature-panel > p { font-size: 24px; }
    .bezhy-public .bezhy-story-art { margin-bottom: 30px; }
    .bezhy-public .account-header { padding-inline: 5%; gap: 12px; }
    .bezhy-public .account-header nav { gap: 12px; }
    .bezhy-public .account-header nav a { font-size: 12px; }
    .bezhy-public .dock-action { border-radius: 10px; }
    .bezhy-public .dock-action > img { width: 22px; height: 22px; flex: 0 0 auto; }
    .bezhy-public .dock-whatsapp > span { color: var(--color-white); }
    .bezhy-public .drawer-head h2 { font-size: 29px; }
}
@media (prefers-reduced-motion: reduce) {
    .bezhy-public *, .bezhy-public *::before, .bezhy-public *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
