/* Website presentation only. Customer invitation artwork has its own theme. */
@font-face {
    font-family: 'Heebo Local';
    src: url('../fonts/Heebo-Regular.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: optional;
}
.site-elegant {
    --primary: #173c33;
    --primary-dark: #102b24;
    --primary-light: #edf1e9;
    --accent: #c64937;
    --accent-dark: #a83b2c;
    --text: #252b28;
    --text-light: #59655f;
    --border: #d9dfda;
    --font: 'Heebo Local', 'Heebo', Arial, sans-serif;
    font-family: var(--font);
    background: var(--white);
    color: var(--text);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.site-elegant :where(h1, h2, h3, h4, p, a, button, label, small, span):not(.hoopa-custom-phone *) {
    letter-spacing: 0;
}
.site-elegant :where(button, a, input, select, textarea):focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 4px;
}
.site-elegant :where(button, input, select, textarea) { accent-color: var(--primary); }
.site-elegant :where(button, .btn) { touch-action: manipulation; }
.site-elegant .container { max-width: 1200px; padding-inline: 28px; }
.site-elegant .section { padding-block: 72px; }
.site-elegant .section-title { margin-bottom: 36px; }
.site-elegant .section-title h2 { font-size: 34px; font-weight: 600; line-height: 1.3; }
.site-elegant .section-title p { font-size: 17px; color: var(--text-light); }
.site-elegant .hoopa-eyebrow {
    display: block; padding: 0; border: 0; border-radius: 0;
    background: none; box-shadow: none; color: var(--text-light);
    font-size: 14px; font-weight: 500; margin-bottom: 12px;
}

/* Text navigation and a single, quiet primary action. */
.site-elegant .top-bar { background: var(--light); color: var(--text-light); font-size: 12px; padding: 7px 0; }
.site-elegant .top-bar a { color: var(--text-light); }
.site-elegant .header-main { padding: 12px 0; box-shadow: none; border-bottom: 1px solid var(--border); background: #fff; }
.site-elegant .header-main .container { gap: 20px; }
.site-elegant .logo a { font-size: 30px; font-weight: 600; color: var(--text); }
.site-elegant .logo span, .site-elegant .mobile-nav-logo span { color: inherit; }
.site-elegant .site-logo { max-height: 36px; }
.site-elegant .brand-wordmark { display: block; width: 104px; height: auto; object-fit: contain; }
.site-elegant .site-logo.brand-wordmark { max-height: none; }
.site-elegant .mobile-nav-logo .brand-wordmark { width: 111px; }
.site-elegant .footer-logo-img.brand-wordmark { width: 124px; max-height: none; }
.site-elegant .main-nav a { padding: 9px 10px; font-size: 13px; border-radius: 4px; font-weight: 400; }
.site-elegant .main-nav a.active { background: none; color: var(--primary); font-weight: 500; }
.site-elegant .main-nav a:hover { background: var(--light); color: var(--primary); }
.site-elegant .main-nav .dropdown-menu { border: 1px solid var(--border); border-radius: 8px; box-shadow: var(--shadow-lg); }
.site-elegant .main-nav .dropdown-group-title { background: none; border: 0; }
@media (min-width: 769px) {
    .site-elegant .main-nav .dropdown:focus-within .dropdown-menu { display: block; opacity: 1; visibility: visible; }
}
.site-elegant .header-buy-btn { background: var(--primary); color: #fff; border-radius: 6px; padding: 9px 18px; font-size: 13px; font-weight: 500; box-shadow: none; white-space: nowrap; }
.site-elegant .header-buy-btn:hover { background: var(--primary-dark); transform: none; }
.site-elegant .breadcrumb-nav { background: #fff; border-bottom: 1px solid var(--border); padding-block: 12px; }
.site-elegant .breadcrumb-nav a { color: var(--text-light); }

/* Hide only decoration, never a functional icon-only control. */
.site-elegant :is(.hoopa-eyebrow, .section-title, .feature-item, .hoopa-pick-badge,
    .hoopa-pick-instant, .hoopa-media-badges, .hoopa-media-pill, .hoopa-testi-proof,
    .hoopa-rsvp-feature, .hoopa-story-benefit, .account-bar h1, .account-stats h2,
    .account-login-head, .account-login-form label, .hoopa-custom-hero) > i,
.site-elegant .main-nav ul a > i:not(.mobile-dropdown-arrow),
.site-elegant :is(.hoopa-cat-card-icon, .hoopa-pick-card-icon, .hoopa-type-picker-card-icon,
    .hoopa-cta-picker-card-icon, .hoopa-about-pillar-icon, .hoopa-about-offering-icon,
    .hoopa-about-story-deco, .rsvp-flow-icon, .account-tile-icon),
.site-elegant :is(.hoopa-pick-confetti, .hoopa-about-confetti, .rsvp-confetti,
    .hoopa-cta-picker-confetti, .contact-confetti, .blog-confetti,
    .hoopa-didyouknow-swash, .hoopa-testi-swash, .footer-tilt) { display: none; }
.site-elegant :is(.hoopa-pick-section, .hoopa-about-story-card, .hoopa-cat-card,
    .hoopa-about-pillar, .newsletter, .contact-hero, .blog-hero)::before,
.site-elegant :is(.hoopa-pick-section, .newsletter, .contact-hero, .blog-hero)::after { content: none; }

.site-elegant :is(.btn-primary, .hoopa-intro-cta, .hoopa-rsvp-cta, .hoopa-story-cta,
    .hoopa-testi-cta, .hoopa-cats-main-cta, .hoopa-design-submit,
    .account-upgrade-submit, .hoopa-pick-card-cta-primary) {
    background: var(--primary); color: #fff; border: 1px solid transparent;
    border-radius: 6px; box-shadow: none; font-weight: 500; font-size: 15px;
    min-height: 44px; line-height: 1.5; padding: 11px 22px; transform: none;
    text-align: center; white-space: normal;
}
.site-elegant :is(.btn-primary, .hoopa-intro-cta, .hoopa-rsvp-cta, .hoopa-story-cta,
    .hoopa-testi-cta, .hoopa-cats-main-cta, .hoopa-design-submit,
    .account-upgrade-submit):hover { background: var(--primary-dark); color: #fff; box-shadow: none; transform: none; }
.site-elegant :is(.btn-outline, .btn-secondary) { border-radius: 6px; border: 1px solid var(--border); color: var(--text); background: #fff; box-shadow: none; font-weight: 500; }
.site-elegant :is(.btn-outline, .btn-secondary):hover { background: var(--light); color: var(--text); transform: none; }
.site-elegant .btn-lg { font-size: 16px; padding: 12px 24px; }

/* Home: real invitation artwork on a full-width product stage. */
.site-elegant .elegant-hero {
    position: relative; height: min(690px, calc(100svh - 180px)); overflow: hidden;
    background: #f5f5f7; text-align: center;
}
.site-elegant .elegant-hero-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.site-elegant .elegant-hero-art img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.site-elegant .elegant-hero-art--custom { top: 310px; bottom: 24px; height: auto; }
.site-elegant .elegant-hero-art--custom :is(img, video) { height: 100%; width: 100%; object-fit: contain; }
.site-elegant .elegant-hero-content { position: relative; z-index: 1; padding: 36px 24px 0; max-width: 860px; margin: auto; }
.site-elegant .elegant-wordmark { display: block; font-size: 22px; font-weight: 500; margin-bottom: 8px; }
.site-elegant .elegant-hero h1 { font-size: 52px; font-weight: 600; line-height: 1.2; margin: 0 0 14px; }
.site-elegant .elegant-hero p { font-size: 19px; color: var(--text-light); line-height: 1.6; margin: 0 auto 20px; }
.site-elegant .elegant-hero-actions { display: flex; align-items: center; justify-content: center; gap: 24px; flex-wrap: wrap; }
.site-elegant .elegant-hero-link { color: var(--primary); font-size: 15px; padding: 10px 0; }
.site-elegant .elegant-home-intro { border-bottom: 1px solid var(--border); padding-block: 34px; }
.site-elegant .elegant-home-intro .container { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
.site-elegant .elegant-home-intro article { display: grid; grid-template-columns: 28px 1fr; gap: 8px 12px; align-content: start; }
.site-elegant .elegant-step-number { color: var(--text-light); font-size: 14px; padding-top: 3px; }
.site-elegant .elegant-home-intro h2 { font-size: 17px; line-height: 1.5; font-weight: 500; margin: 0 0 5px; }
.site-elegant .elegant-home-intro p { font-size: 14px; line-height: 1.6; color: var(--text-light); }
.site-elegant .hoopa-cats-section { background: #fff; }
.site-elegant .hoopa-cats-perks, .site-elegant .hoopa-cats-main-cta { display: none; }
.site-elegant .hoopa-cats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px 22px; }
.site-elegant .hoopa-cat-card { padding: 0 0 16px; background: none; border: 0; border-radius: 0; box-shadow: none; text-align: right; gap: 14px; }
.site-elegant .hoopa-cat-card:hover { transform: none; box-shadow: none; }
.site-elegant .elegant-category-image { width: 100%; aspect-ratio: 4 / 5; object-fit: contain; display: block; background: var(--light); border-radius: 8px; padding: 18px; }
.site-elegant .hoopa-cat-card h3 { font-size: 19px; font-weight: 500; }
.site-elegant .hoopa-cat-card-note { font-size: 13px; color: var(--text-light); line-height: 1.6; min-height: 42px; }
.site-elegant .hoopa-cat-card-price { font-size: 16px; font-weight: 500; color: var(--text); }
.site-elegant .hoopa-cat-card-price small { font-size: 12px; color: var(--text-light); font-weight: 400; }
.site-elegant .hoopa-cat-card-cta { font-weight: 400; font-size: 14px; justify-content: flex-start; }
.site-elegant .hoopa-media { padding: 64px 0; background: var(--light); }
.site-elegant .hoopa-media-head h2 { font-size: 30px; font-weight: 600; }
.site-elegant .hoopa-media-badges, .site-elegant .hoopa-media-pill { display: none; }
.site-elegant .hoopa-media-card { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 24px; }
.site-elegant .hoopa-media-heading { font-size: 21px; font-weight: 500; }
.site-elegant .hoopa-media-quote { font-size: 15px; min-height: 0; }
.site-elegant .hoopa-media-browser { box-shadow: none; border-color: var(--border); }
.site-elegant .hoopa-media-browser-bar { background: var(--light); border-color: var(--border); }
.site-elegant .hoopa-callout-rsvp { background-color: var(--light); background-image: none !important; }
.site-elegant .hoopa-callout-rsvp::before, .site-elegant .hoopa-callout-rsvp::after { content: none; }
.site-elegant .hoopa-rsvp-layout { gap: 56px; }
.site-elegant .hoopa-rsvp-brand, .site-elegant .hoopa-rsvp-live-note { display: none; }
.site-elegant .hoopa-rsvp-title { font-size: 34px; font-weight: 600; line-height: 1.3; }
.site-elegant .hoopa-rsvp-heading { align-items: flex-start; gap: 20px; }
.site-elegant .hoopa-rsvp-price { background: none; border: 0; padding: 0; box-shadow: none; color: var(--text); }
.site-elegant .hoopa-rsvp-price strong { color: var(--text); font-size: 28px; font-weight: 500; }
.site-elegant .hoopa-rsvp-lead { font-size: 16px; color: var(--text-light); }
.site-elegant .hoopa-rsvp-feature { background: none; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding: 12px 0; font-size: 14px; box-shadow: none; }
.site-elegant .hoopa-rsvp-bottom { background: none; border: 0; box-shadow: none; padding-inline: 0; }
.site-elegant .hoopa-rsvp-highlight { color: var(--text); font-weight: 500; }
.site-elegant .hoopa-rsvp-secondary { font-weight: 400; color: var(--primary); }
.site-elegant .elegant-rsvp-preview { width: 100%; max-width: 280px; height: auto; margin: auto; display: block; }
.site-elegant .rsvp-live-badge { display: none; }
.site-elegant .hoopa-testi { background: #fff !important; padding: 72px 0; color: var(--text); }
.site-elegant .hoopa-testi-overlay, .site-elegant .hoopa-testi-proof, .site-elegant .hoopa-testi-qmark, .site-elegant .hoopa-testi-avatar { display: none; }
.site-elegant .hoopa-testi-title { color: var(--text); font-size: 32px; font-weight: 600; }
.site-elegant .hoopa-testi-eyebrow, .site-elegant .hoopa-testi-lead { color: var(--text-light); }
.site-elegant .hoopa-testi-slide { background: var(--light); color: var(--text); border: 0; border-radius: 8px; box-shadow: none; }
.site-elegant .hoopa-testi-text { color: var(--text); font-size: 21px; font-weight: 400; line-height: 1.75; }
.site-elegant .hoopa-testi-meta strong { color: var(--text); font-weight: 500; }
.site-elegant .hoopa-testi-meta span, .site-elegant .hoopa-testi-stars { color: var(--text-light); }
.site-elegant .hoopa-testi-nav { background: #fff; color: var(--text); border: 1px solid var(--border); box-shadow: none; }
.site-elegant .hoopa-story { background: var(--light); }
.site-elegant .hoopa-story-title { font-size: 32px; font-weight: 600; }
.site-elegant .hoopa-story-benefit { background: none; border: 0; border-radius: 0; border-bottom: 1px solid var(--border); padding-inline: 0; box-shadow: none; }
.site-elegant .hoopa-story-benefit strong { font-weight: 500; }

/* Product choice and catalog. */
.site-elegant .hoopa-pick-section { background: #fff; padding: 56px 0 72px; }
.site-elegant .hoopa-pick-intro { margin-bottom: 36px; }
.site-elegant .hoopa-pick-intro h1 { font-size: 38px; font-weight: 600; line-height: 1.3; margin: 10px 0 14px; }
.site-elegant .hoopa-pick-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; max-width: 960px; }
.site-elegant .hoopa-pick-card { border: 1px solid var(--border); border-radius: 8px; padding: 26px; background: #fff; box-shadow: none; overflow: hidden; }
.site-elegant .hoopa-pick-card:hover, .site-elegant .hoopa-pick-card-video.is-open { transform: none; border-color: var(--primary); box-shadow: none; }
.site-elegant .hoopa-pick-card h2 { font-size: 24px; font-weight: 500; line-height: 1.4; }
.site-elegant .hoopa-pick-badge { position: static; background: none; box-shadow: none; color: var(--primary); font-weight: 500; padding: 0; margin: 0 0 10px; min-height: 22px; }
.site-elegant .elegant-product-preview { display: block; width: 100%; height: 235px; object-fit: contain; background: var(--light); border-radius: 4px; margin-bottom: 24px; padding: 16px; }
.site-elegant .hoopa-pick-card-desc { font-size: 15px; min-height: 52px; }
.site-elegant .hoopa-pick-highlight { border: 0; border-radius: 0; background: none; padding: 10px 0 22px; gap: 16px; flex-wrap: wrap; }
.site-elegant .hoopa-pick-price-num { font-size: 32px; color: var(--text); font-weight: 500; }
.site-elegant .hoopa-pick-price-shek { font-size: 19px; color: var(--text); font-weight: 400; }
.site-elegant .hoopa-pick-price-label { font-weight: 400; }
.site-elegant .hoopa-pick-card-video .hoopa-pick-card-cta-primary { background: var(--light); color: var(--primary); }
.site-elegant .hoopa-pick-card:hover .hoopa-pick-card-cta { color: #fff; }
.site-elegant .hoopa-pick-card-video:hover .hoopa-pick-card-cta { color: var(--primary-dark); }
.site-elegant .hoopa-pick-card-cta i { transform: none !important; }
.site-elegant :is(.hoopa-type-picker-box, .hoopa-cta-picker-box) { border-radius: 8px; box-shadow: var(--shadow-lg); padding: 32px; }
.site-elegant :is(.hoopa-type-picker-header, .hoopa-cta-picker-header) h2 { font-size: 26px; font-weight: 600; line-height: 1.4; }
.site-elegant :is(.hoopa-type-picker-card, .hoopa-cta-picker-card) { background: #fff; border: 1px solid var(--border); border-radius: 6px; box-shadow: none; padding: 20px 16px; }
.site-elegant :is(.hoopa-type-picker-card, .hoopa-cta-picker-card):hover { background: var(--light); border-color: var(--primary); transform: none; box-shadow: none; }
.site-elegant :is(.hoopa-type-picker-card-name, .hoopa-cta-picker-card-name) { font-weight: 500; }
.site-elegant :is(.hoopa-inv-template, .product-card, .blog-card) { border-radius: 8px; border-color: var(--border); box-shadow: none; }
.site-elegant :is(.hoopa-inv-template, .product-card, .blog-card):hover { transform: none; box-shadow: none; border-color: var(--primary); }
.site-elegant :is(.hoopa-inv-template-title, .hoopa-inv-templates-header h2) { font-weight: 500; }

/* Editorial and information pages share the same type scale and surfaces. */
.site-elegant :is(.hoopa-about-hero, .page-header, .contact-hero, .blog-hero, .rsvp-hero,
    .hoopa-custom-hero, .hoopa-design-hero) { background: var(--light); padding: 48px 0; border-bottom: 1px solid var(--border); }
.site-elegant :is(.hoopa-about-hero, .page-header, .contact-hero, .blog-hero, .rsvp-hero) h1 { font-size: 40px; font-weight: 600; line-height: 1.3; }
.site-elegant :is(.hoopa-about-story, .hoopa-about-offering, .rsvp-demo-section, .contact-section, .blog-section) { background: #fff; }
.site-elegant :is(.hoopa-about-story-card, .contact-info, .rsvp-demo-panel) { background: none; border: 0; border-radius: 0; box-shadow: none; }
.site-elegant :is(.hoopa-about-pillar, .hoopa-about-offering-card, .rsvp-flow-card) { background: none; border: 0; border-radius: 0; border-top: 1px solid var(--border); padding: 24px 0; text-align: right; box-shadow: none; }
.site-elegant :is(.hoopa-about-pillar, .hoopa-about-offering-card, .rsvp-flow-card):hover { transform: none; box-shadow: none; }
.site-elegant .hoopa-about-story-highlight { background: var(--light); border-color: var(--border); border-radius: 0; }
.site-elegant .hoopa-about-story-highlight strong { background: none; color: var(--text); font-weight: 500; }
.site-elegant .hoopa-about-story-card h2 { font-size: 30px; font-weight: 600; }
.site-elegant .hoopa-about-offering-price { background: none; color: var(--text); padding: 0; font-size: 16px; font-weight: 500; }
.site-elegant .rsvp-live-badge { background: #fff; color: var(--text); border: 1px solid var(--border); border-radius: 6px; box-shadow: none; animation: none; }
.site-elegant .rsvp-price-strip { background: none; border: 0; padding-inline: 0; }
.site-elegant .rsvp-price-strip strong { color: var(--text); }
.site-elegant :is(.contact-form, .contact-form-card, .contact-info-tile, .checkout-form, .checkout-summary, .order-summary) { background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.site-elegant :is(.form-group input:not([type=checkbox], [type=radio], [type=color], [type=range]), .form-group select, .form-group textarea) { border: 1px solid #b9b9c0; border-radius: 6px; background: #fff; color: var(--text); font-size: 16px; min-height: 44px; }
.site-elegant .form-group label { color: var(--text); font-size: 14px; font-weight: 500; }
.site-elegant :is(.form-group input, .form-group select, .form-group textarea):focus { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-light); }
.site-elegant :is(.checkout-section-title, .order-summary h3) { font-size: 21px; font-weight: 500; }

/* Editor chrome. Do not target the phone or its rendered invitation content. */
.site-elegant :is(.hoopa-custom-hero, .hoopa-design-hero) { padding: 30px 0; background: #fff; }
.site-elegant :is(.hoopa-custom-hero, .hoopa-design-hero) h1 { font-size: 30px; font-weight: 600; line-height: 1.35; }
.site-elegant :is(.hoopa-custom-hero, .hoopa-design-hero) p { font-size: 15px; color: var(--text-light); }
.site-elegant .hoopa-custom-editor-section { background: var(--light); padding: 32px 0 56px; }
.site-elegant .hoopa-custom-form { background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.site-elegant .hoopa-wiz-nav { background: #fff; border: 0; border-radius: 0; box-shadow: none; }
.site-elegant .hoopa-wiz-progress-bar { background: var(--primary); }
.site-elegant .hoopa-wiz-dot-circle { box-shadow: none; border-radius: 50%; border-color: var(--border); }
.site-elegant .hoopa-wiz-step-dot.is-active .hoopa-wiz-dot-circle,
.site-elegant .hoopa-wiz-step-dot.is-done .hoopa-wiz-dot-circle { background: var(--primary); box-shadow: none; transform: none; }
.site-elegant .hoopa-wiz-step-dot.is-active .hoopa-wiz-dot-circle > i { display: none; }
.site-elegant .hoopa-wiz-dot-num { border-color: var(--border); font-weight: 500; }
.site-elegant .hoopa-wiz-progress { background: var(--border); height: 2px; }
.site-elegant .hoopa-wiz-dot-circle > .hoopa-wiz-dot-icon { display: none; }
.site-elegant .hoopa-wiz-dot-num { position: static; background: none; color: inherit; border: 0; padding: 0; width: auto; height: auto; font-size: 16px; }
.site-elegant .hoopa-wiz-step-dot.is-active .hoopa-wiz-dot-num { color: #fff; background: none; }
.site-elegant .hoopa-wiz-dot-copy, .site-elegant .hoopa-wiz-step-dot.is-active .hoopa-wiz-dot-copy { background: none; border-color: transparent; box-shadow: none; padding-inline: 0; }
.site-elegant .hoopa-wiz-dot-label { font-weight: 500; white-space: normal; }
.site-elegant .hoopa-wiz-live-status, .site-elegant .hoopa-wiz-live-status.is-happy { background: var(--light); border: 0; border-radius: 4px; box-shadow: none; transform: none; }
.site-elegant .hoopa-wiz-live-copy strong { font-weight: 500; }
.site-elegant .hoopa-wiz-live { background: none; border: 0; box-shadow: none; }
.site-elegant .hoopa-wiz-live-icon { display: none; }
.site-elegant .hoopa-wiz-step > h2 { font-size: 22px; font-weight: 500; }
.site-elegant .hoopa-wiz-step > h2::before { background: var(--light); border-radius: 4px; box-shadow: none; font-weight: 500; }
.site-elegant :is(.hoopa-design-step, .hoopa-custom-summary, .hoopa-design-summary) { background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.site-elegant .hoopa-design-step h2 { font-size: 21px; font-weight: 500; }
.site-elegant .hoopa-design-step-num { background: var(--light); color: var(--text); border-radius: 4px; }
.site-elegant :is(.hoopa-design-note, .hoopa-existing-photo, .hoopa-music-card, .hoopa-addon-card, .hoopa-typo-card, .hoopa-btn-style-card) { background: #fff; border-color: var(--border); border-radius: 6px; box-shadow: none; }
.site-elegant :is(.hoopa-music-card-icon, .hoopa-addon-card-icon) { display: none; }
.site-elegant :is(.hoopa-music-card-head, .hoopa-addon-card-head, .hoopa-typo-card-head) { background: none; }
.site-elegant :is(.hoopa-template-card, .hoopa-font-picker-trigger, .hoopa-font-picker-panel,
    .hoopa-ptype-btn, .hoopa-photo-toggle-btn, .hoopa-drop-zone, .hoopa-photos-dropzone,
    .hoopa-song-card, .hoopa-color-row, .hoopa-btn-style-option) { border-radius: 6px; box-shadow: none; border-color: var(--border); }
.site-elegant :is(.hoopa-template-card, .hoopa-ptype-btn, .hoopa-photo-toggle-btn, .hoopa-song-card):hover { transform: none; box-shadow: none; border-color: var(--primary); background: var(--light); }
.site-elegant :is(.hoopa-template-card.is-active, .hoopa-song-card.is-selected, .hoopa-ptype-btn.is-active, .hoopa-photo-toggle-btn.is-active) { background: var(--primary-light); border-color: var(--primary); box-shadow: none; transform: none; }
.site-elegant :is(.hoopa-photo-toggle-btn, .hoopa-ptype-btn) { flex-direction: row; font-size: 14px; font-weight: 500; padding: 12px; }
.site-elegant :is(.hoopa-photo-toggle-btn, .hoopa-ptype-btn) > i { display: none; }
.site-elegant .hoopa-design-toggle { background: var(--light); border-radius: 6px; padding: 4px; }
.site-elegant .hoopa-design-toggle-btn { border-radius: 4px; font-weight: 500; }
.site-elegant .hoopa-design-toggle-btn.is-active { background: #fff; color: var(--text); box-shadow: var(--shadow); }
.site-elegant :is(.hoopa-wiz-next, .hoopa-inline-preview-btn.is-play) { background: var(--primary); border-radius: 6px; box-shadow: none; font-weight: 500; }
.site-elegant :is(.hoopa-wiz-back, .hoopa-coupon-btn, .hoopa-custom-font-chip) { border-radius: 6px; box-shadow: none; }
.site-elegant .hoopa-pay-modal-box { border-radius: 8px; }
.site-elegant .hoopa-pay-modal-header { background: var(--light); }
.site-elegant .hoopa-pay-modal-close:hover { transform: none; }
.site-elegant .hoopa-custom-submit { background: none; color: var(--text); border: 0; border-top: 1px solid var(--border); border-radius: 0; box-shadow: none; padding: 24px 0 0; }
.site-elegant .hoopa-custom-submit-price { color: var(--text); font-weight: 500; }
.site-elegant .hoopa-custom-submit-price strong { color: var(--text); font-size: 28px; font-weight: 500; }
.site-elegant .hoopa-custom-summary { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding-inline: 0; }
.site-elegant .hoopa-coupon-box { background: none; border: 0; padding-inline: 0; }
.site-elegant .hoopa-coupon-btn { color: var(--primary); background: var(--light); border: 1px solid var(--border); }
.site-elegant .hoopa-wiz-nav { border-top: 1px solid var(--border); padding-block: 12px; }

/* Customer workspace. Status colors retain their meaning. */
.site-elegant :is(.account-section, .account-login-section) { background: var(--light); padding: 36px 0 64px; }
.site-elegant .account-bar { background: none; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; padding: 0 0 24px; }
.site-elegant .account-bar h1 { font-size: 28px; font-weight: 500; }
.site-elegant :is(.account-share, .account-stats) { border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.site-elegant .account-share > i { display: none; }
.site-elegant .account-grid { gap: 16px; }
.site-elegant .account-tile { border: 1px solid var(--border); border-radius: 8px; box-shadow: none; padding: 24px; }
.site-elegant .account-tile:hover { transform: none; border-color: var(--primary); box-shadow: none; }
.site-elegant .account-tile h3 { font-size: 18px; font-weight: 500; }
.site-elegant :is(.account-logout-btn, .account-share-btn, .rsvp-tab) { border-radius: 6px; font-weight: 500; min-height: 40px; }
.site-elegant .account-share-wa { background: #137a45; }
.site-elegant .account-stat { border-radius: 4px; }
.site-elegant .account-stat-num { font-weight: 500; font-size: 30px; }
.site-elegant .account-login-card { border: 1px solid var(--border); border-radius: 8px; box-shadow: none; }
.site-elegant .account-login-head h1 { font-weight: 500; }
.site-elegant .rsvp-table-wrap { border: 1px solid var(--border); border-radius: 6px; box-shadow: none; overflow-x: auto; }
.site-elegant .rsvp-table th { background: var(--light); font-weight: 500; }

/* Footer and supporting information. */
.site-elegant .features-grid { gap: 24px; border-top: 1px solid var(--border); padding-top: 28px; }
.site-elegant .feature-item { background: none; padding: 0; border: 0; box-shadow: none; }
.site-elegant .feature-item h4 { font-size: 15px; font-weight: 500; }
.site-elegant .feature-item p { font-size: 13px; color: var(--text-light); }
.site-elegant .newsletter { background: var(--light); color: var(--text); padding: 48px 0; }
.site-elegant .newsletter h3 { font-size: 28px; font-weight: 500; color: var(--text); }
.site-elegant .newsletter p { color: var(--text-light); }
.site-elegant .footer-new { background: var(--light); color: var(--text-light); border-top: 1px solid var(--border); padding: 40px 0 24px; }
.site-elegant .footer-logo-row { display: flex; justify-content: center; }
.site-elegant .footer-logo-text, .site-elegant .footer-logo-text span { color: var(--text); font-size: 28px; font-weight: 600; }
.site-elegant .footer-logo-img { filter: none; max-height: 40px; }
.site-elegant .footer-description { color: var(--text-light); font-size: 13px; }
.site-elegant .footer-links a { color: var(--text-light); font-weight: 400; font-size: 13px; }
.site-elegant .footer-links a:hover { color: var(--primary); }
.site-elegant .footer-sep { color: var(--border); }
.site-elegant .footer-social a { color: var(--text-light); background: none; border: 1px solid var(--border); }
.site-elegant .footer-copyright { color: var(--text-light); border-color: var(--border); font-size: 12px; }

@media (max-width: 768px) {
    .site-elegant.mobile-header-utilities .header-buy-btn { display: none; }
    .site-elegant.mobile-header-utilities .header-actions { gap: 4px; }
    .site-elegant.mobile-header-utilities .header-actions :is(.whatsapp-float, .a11y-toggle) { position: static; z-index: auto; width: 44px; height: 44px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: transparent; color: #234c3e; box-shadow: none; transform: none; }
    .site-elegant.mobile-header-utilities .header-actions :is(.whatsapp-float, .a11y-toggle):hover { background: #edf1e9; transform: none; }
    .site-elegant.mobile-header-utilities .header-actions :is(.whatsapp-float, .a11y-toggle) svg { width: 23px; height: 23px; fill: currentColor; }
    .site-elegant.mobile-header-utilities .header-actions .a11y-toggle i { font-size: 23px; }
}

/* Service listings and auxiliary surfaces use the website palette too. */
.site-elegant :is(.contact-hero-confetti, .contact-card-icon, .contact-tile-icon, .contact-hero-eyebrow > i) { display: none; }
.site-elegant .contact-hero-eyebrow { background: none; border: 0; border-radius: 0; padding: 0; color: var(--text-light); font-weight: 500; box-shadow: none; }
.site-elegant .contact-form-card .contact-form { border: 0; border-radius: 0; }
.site-elegant .contact-card-head { border-bottom: 1px solid var(--border); }
.site-elegant .contact-card-head h2 { font-size: 22px; font-weight: 500; }
.site-elegant .contact-tile { background: none; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; padding: 20px 0; }
.site-elegant .contact-tile:hover { transform: none; box-shadow: none; background: var(--light); }
.site-elegant .contact-tile strong { font-weight: 500; }
.site-elegant .cc-inner { border: 1px solid var(--border); border-radius: 8px; box-shadow: var(--shadow-lg); padding: 16px 20px; }
.site-elegant .cc-text p { color: var(--text-light); font-size: 13px; }
.site-elegant .cc-btn { border-radius: 6px; font-weight: 500; min-height: 44px; }
.site-elegant .cc-btn-accept { background: var(--primary); color: #fff; box-shadow: none; }
.site-elegant .cc-btn-accept:hover { background: var(--primary-dark); box-shadow: none; transform: none; }
.site-elegant .cc-icon { display: none; }
.site-elegant .hoopa-rsvp-highlight { background: none; border: 0; padding-inline: 0; font-size: 15px; justify-content: flex-start; }
.site-elegant :is(.hoopa-rsvp-highlight, .hoopa-rsvp-fine) > i { display: none; }
.site-elegant .hoopa-testi-dot { background: var(--border); }
.site-elegant .hoopa-testi-dot.is-active { background: var(--primary); }
.site-elegant .hoopa-testi-author { justify-content: center; }
.site-elegant .hoopa-testi-track { min-height: 220px; }
.site-elegant .hoopa-story-layout:not(:has(.hoopa-story-visual)) { display: block; max-width: 800px; margin-inline: auto; }
.site-elegant .feature-item { opacity: 1; transform: none; }
.site-elegant .feature-item h4 { color: var(--text); }
.site-elegant .fade-up { opacity: 1; transform: none; transition: none; }
.site-elegant :is(.blog-hero-confetti, .blog-empty-icon, .blog-hero-eyebrow > i) { display: none; }
.site-elegant .blog-hero-eyebrow { background: none; border: 0; box-shadow: none; color: var(--text-light); font-weight: 500; }
.site-elegant .blog-featured { background: var(--light); border-radius: 8px; box-shadow: none; }
.site-elegant .blog-featured:hover { transform: none; box-shadow: none; }
.site-elegant .blog-featured-title { font-size: 28px; font-weight: 600; }
.site-elegant .blog-card-title { font-size: 20px; font-weight: 500; }
.site-elegant .blog-featured-badge { background: #fff; color: var(--text); border-radius: 4px; box-shadow: none; font-weight: 500; }

/* Guides and order confirmations, separate from the invitation artwork. */
.site-elegant :is(.learn-page, .cg-hero, .cg-section-alt, .hoopa-thankyou) { background: var(--light); }
.site-elegant :is(.learn-card, .hoopa-thankyou-card, .hoopa-custom-paid-box) { background: none; border: 0; border-radius: 0; box-shadow: none; }
.site-elegant :is(.learn-card, .hoopa-thankyou, .hoopa-custom-paid) h1 { font-size: 32px; font-weight: 600; }
.site-elegant :is(.learn-lock-icon, .cg-hero-bg, .cg-step-icon, .cg-channel-icon, .cg-option-icon, .cg-cta-deco,
    .cg-hero-eyebrow > i, .cg-hero-actions > a > i, .cg-nav a > i, .cg-edit-item > i) { display: none; }
.site-elegant .learn-login-form input[type="password"] { border-width: 1px; border-radius: 6px; letter-spacing: 0; }
.site-elegant .learn-video-wrap { border-radius: 8px; box-shadow: none; }
.site-elegant .cg-hero { padding: 56px 0; }
.site-elegant .cg-hero h1 { font-size: 40px; font-weight: 600; }
.site-elegant .cg-hero-accent { background: none; color: var(--text); }
.site-elegant .cg-hero-eyebrow { background: none; border: 0; padding: 0; box-shadow: none; color: var(--text-light); font-weight: 500; }
.site-elegant .cg-hero-lead { font-size: 17px; color: var(--text-light); }
.site-elegant .cg-nav { background: #fff; box-shadow: none; border-color: var(--border); }
.site-elegant .cg-nav a { background: none; color: var(--text); border-radius: 4px; font-weight: 400; }
.site-elegant .cg-nav a:hover { background: var(--light); color: var(--primary); transform: none; box-shadow: none; }
.site-elegant .cg-nav a span { background: none; box-shadow: none; font-weight: 500; color: var(--text-light); }
.site-elegant .cg-section-head h2 { font-size: 30px; font-weight: 600; }
.site-elegant .cg-step { grid-template-columns: 44px minmax(0, 1fr); gap: 20px; }
.site-elegant .cg-step-num { width: 40px; height: 40px; border-radius: 4px; background: var(--light); color: var(--text-light); font-size: 20px; font-weight: 400; box-shadow: none; }
.site-elegant .cg-step:hover .cg-step-num { transform: none; }
.site-elegant .cg-step-line { background: var(--border); width: 1px; }
.site-elegant .cg-step-card { padding: 0 0 32px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; }
.site-elegant .cg-step-card:hover { transform: none; box-shadow: none; }
.site-elegant .cg-step-card h3 { font-size: 23px; font-weight: 500; }
.site-elegant .cg-step-tag { background: none; padding: 0; color: var(--text-light); font-weight: 400; }
.site-elegant :is(.cg-channel, .cg-option, .cg-edit-item, .cg-faq-item, .cg-rsvp-cell) { background: #fff; border-color: var(--border); border-radius: 8px; box-shadow: none; }
.site-elegant :is(.cg-channel, .cg-edit-item, .cg-faq-item, .cg-rsvp-cell):hover { background: var(--light); border-color: var(--border); transform: none; box-shadow: none; }
.site-elegant .cg-channel::before, .site-elegant .cg-cta-card::before { content: none; }
.site-elegant .cg-option-primary { border: 1px solid var(--primary); }
.site-elegant .cg-option-badge { background: var(--primary); border-radius: 4px; font-weight: 500; box-shadow: none; }
.site-elegant .cg-credentials li { padding: 10px 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; flex-wrap: wrap; }
.site-elegant :is(.cg-code, .cg-option-hint, .cg-callout) { background: var(--light); color: var(--text); border-color: var(--border); border-radius: 6px; }
.site-elegant .cg-callout-warn { background: #fff9e8; border-color: #b77113; }
.site-elegant .cg-faq-item summary { font-weight: 500; }
.site-elegant .cg-faq-body { border-top: 1px solid var(--border); }
.site-elegant .cg-cta { background: var(--light); }
.site-elegant .cg-cta-card { display: block; background: none; border-radius: 0; box-shadow: none; padding: 16px 0; }
.site-elegant .cg-cta-card h2 { font-size: 28px; font-weight: 600; }
.site-elegant .cg-cta-wa { background: #137a45 !important; border-color: #137a45 !important; }
.site-elegant :is(.hoopa-thankyou-icon, .hoopa-custom-paid-icon) { width: 56px; height: 56px; background: #eaf5ee; color: #137a45; box-shadow: none; font-size: 28px; }
.site-elegant .hoopa-thankyou-number { background: #fff; border: 1px solid var(--border); border-radius: 6px; }
.site-elegant .hoopa-thankyou-number strong { color: var(--text); letter-spacing: 0; }
.site-elegant .hoopa-custom-paid-url-box { background: var(--light); border-radius: 6px; }
.site-elegant .hoopa-custom-paid-url-row input { min-width: 0; border-radius: 6px; }

@media (max-width: 600px) {
    .site-elegant :is(.learn-card, .hoopa-thankyou-card, .hoopa-custom-paid-box) { padding: 24px 0; }
    .site-elegant :is(.learn-card, .hoopa-thankyou, .hoopa-custom-paid) h1, .site-elegant .cg-hero h1 { font-size: 28px; }
    .site-elegant .cg-section-head h2 { font-size: 25px; }
    .site-elegant .cg-step { grid-template-columns: 1fr; gap: 12px; }
    .site-elegant .cg-step-marker { align-items: flex-start; }
    .site-elegant .cg-step-line { display: none; }
    .site-elegant .cg-step-card h3 { font-size: 21px; }
    .site-elegant .cg-channels, .site-elegant .cg-edit-grid { grid-template-columns: 1fr; }
    .site-elegant .hoopa-thankyou-details { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
}

@media (max-width: 1100px) and (min-width: 769px) {
    .site-elegant .header-main .container { gap: 12px; }
    .site-elegant .main-nav a { padding-inline: 6px; font-size: 12px; }
    .site-elegant .header-buy-btn { padding-inline: 12px; }
}
@media (max-width: 860px) {
    .site-elegant .hoopa-cats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .site-elegant .hoopa-rsvp-layout { gap: 32px; }
    .site-elegant .hoopa-pick-cards { gap: 20px; }
}
@media (max-width: 768px) {
    .site-elegant .container { padding-inline: 20px; }
    .site-elegant .section { padding-block: 44px; }
    .site-elegant .top-bar .container { justify-content: center; }
    .site-elegant .top-bar .container > div:last-child { display: none; }
    .site-elegant .header-main { padding-block: 10px; }
    /* The mobile drawer shares the storefront palette, not the workspace blue. */
    .site-elegant .main-nav {
        --nav-green: #173c33;
        --nav-sage: #edf1e9;
        --nav-muted: #5c6962;
        width: 360px;
        max-width: calc(100vw - 28px);
        background: #fff;
        border: 0;
        border-top: 3px solid #bfa176;
        box-shadow: -12px 0 36px rgb(23 60 51 / 12%);
        overscroll-behavior: contain;
        scroll-padding-block: 92px 20px;
    }
    .site-elegant .main-nav::before { content: none; }
    .site-elegant .main-nav :is(a, button):focus-visible { outline-color: var(--nav-green); outline-offset: -3px; }
    .site-elegant .mobile-nav-header { top: 0; padding: 16px 20px; background: #fff; border-color: #e3e7e1; }
    .site-elegant .main-nav .mobile-nav-logo { min-height: 44px; padding: 0; }
    .site-elegant .mobile-nav-logo .brand-wordmark { width: 100px; }
    .site-elegant .mobile-nav-close {
        flex: 0 0 44px; width: 44px; height: 44px; border: 0; border-radius: 4px;
        background: var(--nav-sage); color: var(--nav-green); font-size: 20px; box-shadow: none;
    }
    .site-elegant .mobile-nav-close:hover { background: #e0e7dc; color: var(--nav-green); }
    .site-elegant .mobile-nav-hero { display: flex; flex: 0 0 auto; gap: 12px; padding: 20px; background: #fff; border: 0; }
    .site-elegant .mobile-nav-kicker { color: var(--nav-green); font-size: 16px; font-weight: 500; }
    .site-elegant .main-nav .mobile-nav-cta {
        display: flex; justify-content: space-between; gap: 12px; min-height: 48px;
        padding: 12px 16px !important; border-radius: 6px !important;
        background: #c64937; color: #fff !important; box-shadow: none;
    }
    .site-elegant .main-nav .mobile-nav-cta:hover { background: #ae3d2d; }
    .site-elegant .mobile-nav-cta span { font-size: 16px; font-weight: 500; line-height: 1.5; }
    .site-elegant .mobile-nav-cta i { width: 20px !important; height: 20px; background: none; color: #fff !important; font-size: 16px !important; }
    .site-elegant .main-nav > ul { flex: 1 0 auto; gap: 0; padding: 0 20px 20px; }
    .site-elegant .mobile-nav-section-title { display: none; }
    .site-elegant .main-nav li { border-radius: 0; overflow: visible; }
    .site-elegant .main-nav ul a {
        min-height: 46px; padding: 10px 12px; border-radius: 4px;
        color: #252d29; font-size: 16px; font-weight: 400; line-height: 1.6;
    }
    .site-elegant .main-nav ul a:hover { background: #f5f7f3; color: var(--nav-green); }
    .site-elegant .main-nav ul a.active {
        background: var(--nav-sage); color: var(--nav-green); font-weight: 500;
        box-shadow: inset -3px 0 0 var(--nav-green);
    }
    .site-elegant .main-nav > ul > li:last-child { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e3e7e1; }
    .site-elegant .main-nav .mobile-dropdown-arrow { color: var(--nav-green) !important; font-size: 12px !important; }
    .site-elegant .main-nav .dropdown-menu {
        display: none; opacity: 1; visibility: visible; margin: 4px 12px 10px 0;
        padding: 0 12px 0 0; border: 0; border-right: 1px solid #bfa176; border-radius: 0;
        box-shadow: none; background: none; transition: none;
    }
    .site-elegant .main-nav .dropdown.open > .dropdown-menu { display: block; }
    .site-elegant .main-nav .dropdown:not(.open) > .dropdown-menu { display: none; }
    .site-elegant .main-nav .dropdown-menu-inner { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .site-elegant .main-nav .dropdown-menu :is(a.dropdown-group-title, a.dropdown-view-all) {
        flex-direction: row; justify-content: flex-start; min-height: 44px;
        padding: 9px 12px !important; margin: 0; border: 0 !important; border-radius: 4px;
        background: transparent !important; color: var(--nav-green) !important;
        font-size: 15px !important; font-weight: 400 !important; box-shadow: none; text-align: right;
    }
    .site-elegant .main-nav .dropdown-menu :is(a.dropdown-group-title, a.dropdown-view-all):hover { background: var(--nav-sage) !important; }
    .site-elegant .main-nav .dropdown-menu a.dropdown-view-all { font-weight: 500 !important; }
    .site-elegant .main-nav .dropdown-group-title span { line-height: 1.6; }
    .site-elegant .mobile-nav-footer { gap: 8px; padding: 20px 20px calc(16px + env(safe-area-inset-bottom)); background: var(--nav-sage); border: 0; }
    .site-elegant .mobile-nav-help-card { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
    .site-elegant .mobile-nav-footer-title { color: var(--nav-green); font-size: 16px; font-weight: 500; line-height: 1.5; }
    .site-elegant .mobile-nav-help-text { margin: 4px 0 12px; color: var(--nav-muted); font-size: 13px; font-weight: 400; line-height: 1.6; }
    .site-elegant .mobile-nav-footer-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
    .site-elegant .main-nav .mobile-nav-contact {
        min-height: 48px; padding: 4px 0; gap: 8px; border: 0; border-radius: 0;
        box-shadow: none; background: none; color: var(--nav-green); font-size: 14px;
    }
    .site-elegant .main-nav .mobile-nav-contact:hover { color: #0b271f; text-decoration: underline; }
    .site-elegant .main-nav .mobile-nav-contact i:first-child,
    .site-elegant .main-nav .mobile-nav-social i:first-child {
        flex: 0 0 20px; width: 20px; height: 24px; padding: 0; border-radius: 0;
        color: var(--nav-green); background: none; font-size: 18px;
    }
    .site-elegant .mobile-nav-contact-text { gap: 4px; }
    .site-elegant .mobile-nav-contact-text small { color: var(--nav-muted); font-size: 11px; font-weight: 400; line-height: 1.5; direction: ltr; }
    .site-elegant .mobile-nav-social { justify-content: flex-start; gap: 16px; border-top: 1px solid #d6ddd1; padding-top: 8px; }
    .site-elegant .main-nav .mobile-nav-social a { min-height: 44px; padding: 4px 0; gap: 6px; color: var(--nav-muted); font-size: 12px; background: none; }
    .site-elegant .nav-overlay { background: rgb(15 31 25 / 32%); backdrop-filter: none; }
    .site-elegant.mobile-nav-open :is(.whatsapp-float, .a11y-toggle, .mobile-toggle) { visibility: hidden; pointer-events: none; }
    .site-elegant .elegant-hero { height: min(670px, calc(100svh - 180px)); }
    .site-elegant .elegant-hero-content { padding-top: 32px; }
    .site-elegant .elegant-hero h1 { font-size: 36px; }
    .site-elegant .elegant-hero p { font-size: 16px; max-width: 330px; }
    .site-elegant .elegant-wordmark { font-size: 20px; }
    .site-elegant .elegant-hero-actions { gap: 20px; }
    .site-elegant .elegant-home-intro .container { gap: 22px; }
    .site-elegant .elegant-home-intro article { display: block; }
    .site-elegant .elegant-step-number { display: block; margin-bottom: 8px; }
    .site-elegant .elegant-home-intro h2 { font-size: 15px; }
    .site-elegant .elegant-home-intro p { font-size: 13px; }
    .site-elegant .section-title h2, .site-elegant .hoopa-rsvp-title { font-size: 28px; }
    .site-elegant .section-title p { font-size: 15px; }
    .site-elegant .hoopa-cats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; }
    .site-elegant .elegant-category-image { padding: 12px; }
    .site-elegant .hoopa-cat-card h3 { font-size: 17px; }
    .site-elegant .hoopa-cat-card-note { min-height: 0; font-size: 12px; }
    .site-elegant .hoopa-cat-card-price { font-size: 15px; }
    .site-elegant .hoopa-pick-section { padding: 32px 0 44px; }
    .site-elegant .hoopa-pick-intro h1 { font-size: 30px; }
    .site-elegant .hoopa-pick-cards { grid-template-columns: 1fr; max-width: 480px; gap: 24px; }
    .site-elegant .hoopa-pick-card { padding: 22px; }
    .site-elegant .hoopa-pick-card h2 { font-size: 22px; }
    .site-elegant .elegant-product-preview { height: 215px; }
    .site-elegant :is(.hoopa-type-picker-box, .hoopa-cta-picker-box) { padding: 44px 20px 24px; }
    .site-elegant :is(.hoopa-type-picker-header, .hoopa-cta-picker-header) h2 { font-size: 24px; }
    .site-elegant :is(.hoopa-about-hero, .page-header, .contact-hero, .blog-hero, .rsvp-hero) h1 { font-size: 30px; }
    .site-elegant :is(.hoopa-custom-hero, .hoopa-design-hero) h1 { font-size: 25px; }
    .site-elegant .hoopa-about-story-card { padding: 24px 0; }
    .site-elegant .hoopa-rsvp-heading { flex-wrap: wrap; }
    .site-elegant .hoopa-testi-title, .site-elegant .hoopa-story-title { font-size: 28px; }
    .site-elegant .hoopa-testi-text { font-size: 18px; }
    .site-elegant .account-bar h1 { font-size: 24px; }
    .site-elegant .account-login-card { padding: 28px 24px; }
    .site-elegant .features-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-height: 740px) {
    .site-elegant .elegant-hero-content { padding-top: 14px; }
    .site-elegant .elegant-wordmark { font-size: 18px; margin-bottom: 6px; }
    .site-elegant .elegant-hero h1 { font-size: 28px; margin-bottom: 10px; }
    .site-elegant .elegant-hero p { font-size: 14px; margin-bottom: 12px; }
    .site-elegant .elegant-hero-actions .btn { min-height: 40px; padding: 9px 16px; font-size: 14px; }
}
@media (min-width: 769px) and (max-height: 880px) {
    .site-elegant .elegant-hero-content { padding-top: 24px; }
    .site-elegant .elegant-hero h1 { font-size: 40px; }
    .site-elegant .elegant-hero p { font-size: 17px; }
}
@media (max-width: 380px) {
    .site-elegant .container { padding-inline: 16px; }
    .site-elegant .elegant-hero h1 { font-size: 30px; }
    .site-elegant .elegant-home-intro .container { grid-template-columns: 1fr; gap: 20px; }
    .site-elegant .elegant-home-intro article { display: grid; }
    .site-elegant .hoopa-type-picker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 380px) and (max-height: 740px) {
    .site-elegant .elegant-hero-content { padding-top: 8px; }
    .site-elegant .elegant-wordmark { margin-bottom: 4px; }
    .site-elegant .elegant-hero h1 { font-size: 26px; margin-bottom: 8px; }
    .site-elegant .elegant-hero p { font-size: 13px; margin-bottom: 10px; }
    .site-elegant .elegant-home-intro { padding-top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .site-elegant { scroll-behavior: auto; }
    .site-elegant :is(.hoopa-type-picker-box, .hoopa-cta-picker-box, .hoopa-pick-card,
        .hoopa-wiz-progress-bar, .hoopa-wiz-step-dot, .hoopa-testi-slide,
        .main-nav, .nav-overlay, .mobile-dropdown-arrow) { animation: none; transition: none; }
}
