@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Caveat:wght@400;700&display=swap');

/* Base CSS Reset & Masonry Structure */
:root {
      --bg-gradient: linear-gradient(180deg, #f0f4fd 0%, #e0ebf9 100%);
      --text-dark: #1a1f36;
      --text-muted: #6b7280;
      --primary: #4f46e5;
      --radius-sm: 8px;
      --radius-md: 16px;
      --radius-lg: 24px;
      --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.05);
      --shadow-hover: 0 20px 40px rgba(0, 0, 0, 0.1);
}

* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
}

body {
      font-family: 'Inter', -apple-system, sans-serif;
      background: var(--bg-gradient);
      min-height: 100vh;
      color: var(--text-dark);
      padding: 20px 15px;
}

.page-container {
      max-width: 1400px;
      margin: 0 auto;
      width: 100%;
      overflow-x: hidden;
}

@media (min-width: 640px) {
      body {
            padding: 40px 20px;
      }

      .page-container {
            overflow-x: visible;
      }
}

/* Header Aesthetics */
.hero-header {
      text-align: center;
      margin-bottom: 60px;
      padding-top: 40px;
}

.logo {
      font-weight: 700;
      font-size: 1.2rem;
      color: var(--primary);
      text-transform: uppercase;
      letter-spacing: 0.1em;
      margin-bottom: 20px;
}

.glow-text {
      font-size: 3rem;
      font-weight: 800;
      line-height: 1.1;
      margin-bottom: 10px;
      background: linear-gradient(135deg, #1a1f36, #4f46e5, #ec4899);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      text-shadow: 0 10px 30px rgba(79, 70, 229, 0.2);
}

@media (min-width: 640px) {
      .glow-text {
            font-size: 4.5rem;
            margin-bottom: 20px;
      }
}

.subtitle {
      font-size: 1rem;
      color: var(--text-muted);
      max-width: 600px;
      margin: 0 auto 30px;
      line-height: 1.6;
}

@media (min-width: 640px) {
      .subtitle {
            font-size: 1.25rem;
            margin: 0 auto 40px;
      }
}

.pill-nav {
      display: flex;
      justify-content: center;
      gap: 12px;
      flex-wrap: wrap;
      /* Allow wrapping on small screens */
      padding: 0 10px;
      /* Side padding so pills don't hit edge */
}

.pill {
      border: 1px solid rgba(0, 0, 0, 0.1);
      background: rgba(255, 255, 255, 0.5);
      backdrop-filter: blur(10px);
      padding: 10px 24px;
      border-radius: 40px;
      font-family: 'Inter', sans-serif;
      font-weight: 500;
      color: var(--text-dark);
      cursor: pointer;
      transition: all 0.2s ease;
      white-space: nowrap;
      /* Keep text on one line */
}

.pill:hover,
.pill.active {
      background: var(--text-dark);
      color: #fff;
      border-color: var(--text-dark);
}

/* Masonry Layout core (Mobile First) */
.masonry-grid {
      column-count: 2;
      column-gap: 10px;
      padding: 10px 0;
}

.profile-card {
      break-inside: avoid;
      margin-bottom: 15px;
      border-radius: var(--radius-sm);
      transform: translateY(0);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      background: #fff;
      box-shadow: var(--shadow-soft);

      /* Instagram Story Size Formatting */
      aspect-ratio: 9 / 16;
      position: relative;
      overflow: hidden;
}

.profile-card .card-inner {
      height: 100%;
      width: 100%;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      justify-content: center;
      zoom: 0.45;
}

@media (min-width: 640px) {
      .masonry-grid {
            column-count: 3;
            column-gap: 30px;
            padding: 20px 0;
      }

      .profile-card {
            margin-bottom: 30px;
            border-radius: var(--radius-lg);
      }

      .profile-card .card-inner {
            zoom: 0.7;
      }
}

@media (min-width: 1024px) {
      .profile-card .card-inner {
            zoom: 1;
            /* Reset zoom to 1 or default on desktop! */
      }
}

.profile-card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-hover);
}

/* =========================================================
   INDIVIDUAL CARD STYLES
   ========================================================= */

/* BIRTHDAY: Neon Night */
.card-bday-neon {
      background: #050510;
      border: 1px solid #1a1a3a;
      padding: 0;
}

.card-bday-neon .card-inner {
      padding: 40px 20px;
      text-align: center;
      position: relative;
      overflow: hidden;
      height: 100%;
}

.card-bday-neon .neon-bg {
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle at 50% 50%, rgba(255, 0, 255, 0.15), transparent 60%);
      pointer-events: none;
}

.card-bday-neon .content {
      position: relative;
      z-index: 2;
}

.card-bday-neon .neon-text {
      font-family: 'Righteous', cursive;
      font-size: 3rem;
      color: #fff;
      text-shadow: 0 0 10px #f0f, 0 0 20px #f0f, 0 0 30px #f0f;
      line-height: 1;
      margin-bottom: 30px;
}

.card-bday-neon .photo-circle {
      width: 150px;
      height: 150px;
      margin: 0 auto 20px;
      border-radius: 50%;
      padding: 5px;
      background: linear-gradient(45deg, #0ff, #f0f);
      box-shadow: 0 0 20px rgba(0, 255, 255, 0.5);
}

.card-bday-neon .photo-circle img {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      object-fit: cover;
}

.card-bday-neon .neon-sub {
      font-family: 'Inter', sans-serif;
      color: #0ff;
      letter-spacing: 2px;
      text-transform: uppercase;
      font-size: 0.9rem;
      text-shadow: 0 0 5px #0ff;
      margin-top: 15px;
}

/* BIRTHDAY: Soft Pastel */
.card-bday-pastel {
      background: linear-gradient(135deg, #fdfbfb 0%, #ebedee 100%);
      padding: 0;
}

.card-bday-pastel .card-inner {
      padding: 30px;
      position: relative;
      overflow: hidden;
      text-align: center;
}

.card-bday-pastel .pastel-blobs {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: radial-gradient(circle at top left, rgba(255, 182, 193, 0.4) 0%, transparent 50%), radial-gradient(circle at bottom right, rgba(135, 206, 235, 0.4) 0%, transparent 50%);
      pointer-events: none;
}

.card-bday-pastel .overlap-content {
      position: relative;
      z-index: 2;
}

.card-bday-pastel .main-img {
      width: 100%;
      height: 250px;
      object-fit: cover;
      border-radius: 20px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
      margin-bottom: -30px;
      position: relative;
      z-index: 1;
}

.card-bday-pastel .cursive-text {
      font-family: 'Great Vibes', cursive;
      font-size: 4.5rem;
      color: #ff69b4;
      text-shadow: 2px 2px 0 #fff;
      position: relative;
      z-index: 2;
      line-height: 0.8;
}

.card-bday-pastel .name-text {
      font-family: 'Inter', sans-serif;
      font-weight: 700;
      font-size: 1.5rem;
      color: #333;
      text-transform: uppercase;
      letter-spacing: 5px;
      margin-top: 10px;
}

/* BIRTHDAY: Gold Luxury */
.card-bday-gold {
      background: #111;
      color: #fff;
      padding: 0;
}

.card-bday-gold .card-inner {
      padding: 25px;
}

.card-bday-gold .gold-border {
      border: 2px solid #d4af37;
      padding: 30px 20px;
      text-align: center;
      position: relative;
}

.card-bday-gold .gold-heading {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 4px;
      color: #a67c00;
      margin-bottom: 15px;
}

.card-bday-gold .gold-name {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      color: #d4af37;
      letter-spacing: 2px;
      margin-bottom: 20px;
      background: linear-gradient(to right, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
}

.card-bday-gold .gold-divider {
      width: 50px;
      height: 1px;
      background: #d4af37;
      margin: 0 auto 20px;
}

.card-bday-gold img {
      width: 120px;
      height: 120px;
      border-radius: 50%;
      object-fit: cover;
      filter: grayscale(100%);
      border: 2px solid #d4af37;
      margin-bottom: 20px;
      padding: 3px;
}

.card-bday-gold .gold-date {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      color: #888;
}

/* BIRTHDAY: Polaroid Snapshot */
.card-bday-polaroid {
      background: #f4f4f9;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 40px 20px;
}

.card-bday-polaroid .card-inner {
      transform: rotate(-3deg);
      transition: transform 0.3s;
      width: 100%;
}

.card-bday-polaroid.profile-card:hover .card-inner {
      transform: rotate(0deg);
}

.card-bday-polaroid .polaroid-frame {
      background: #fff;
      padding: 15px 15px 50px 15px;
      box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
      position: relative;
}

.card-bday-polaroid .polaroid-frame img {
      width: 100%;
      height: 280px;
      object-fit: cover;
      background: #000;
}

.card-bday-polaroid .tape {
      position: absolute;
      top: -15px;
      left: 50%;
      transform: translateX(-50%) rotate(-2deg);
      width: 100px;
      height: 35px;
      background: rgba(255, 255, 255, 0.6);
      backdrop-filter: blur(4px);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
      border-left: 2px dashed rgba(0, 0, 0, 0.1);
      border-right: 2px dashed rgba(0, 0, 0, 0.1);
}

.card-bday-polaroid .caption {
      position: absolute;
      bottom: 10px;
      left: 0;
      width: 100%;
      text-align: center;
}

.card-bday-polaroid .marker-font {
      font-family: 'Caveat', cursive;
      font-size: 2rem;
      color: #111;
}

/* BIRTHDAY: Minimal Floral Arch */
.card-bday-floral {
      background: #faf7f2;
      text-align: center;
      padding: 0;
}

.card-bday-floral .card-inner {
      padding: 40px 20px;
}

.card-bday-floral .arch-frame {
      width: 180px;
      height: 250px;
      margin: 0 auto 30px;
      border-radius: 90px 90px 0 0;
      overflow: hidden;
      border: 5px solid #fff;
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);
      background: #e8dccb;
}

.card-bday-floral .arch-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: sepia(20%);
}

.card-bday-floral .serif-title {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      color: #4a4238;
      margin-bottom: 10px;
      font-style: italic;
}

.card-bday-floral .sub-text {
      font-family: 'Inter', sans-serif;
      font-size: 0.9rem;
      color: #8c8273;
      letter-spacing: 1px;
      text-transform: uppercase;
}

/* BIRTHDAY: Premium Editorial */
.card-bday-editorial {
      background: #fdfaf5;
      padding: 0;
}

.card-bday-editorial .card-inner {
      position: relative;
      padding: 25px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      background: #f8f4e6;
      box-shadow: inset 0 0 100px rgba(100, 80, 60, 0.05);
}

.card-bday-editorial .editorial-bg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
}

.card-bday-editorial .bg-noise {
      width: 100%;
      height: 100%;
      opacity: 0.4;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="4" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');
      mix-blend-mode: multiply;
}

.card-bday-editorial .bg-typo {
      position: absolute;
      writing-mode: vertical-rl;
      text-orientation: mixed;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 8rem;
      color: #fff8eb;
      opacity: 0.8;
      top: -30px;
      right: 20px;
      z-index: 1;
      letter-spacing: -5px;
      line-height: 0.8;
}

.card-bday-editorial .photo-wrapper {
      position: absolute;
      top: 80px;
      left: 30px;
      width: 180px;
      height: 260px;
      z-index: 5;
}

.card-bday-editorial .model-main {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 4px;
      position: relative;
      z-index: 2;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.card-bday-editorial .model-shadow {
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 4px;
      left: 25px;
      top: -10px;
      filter: grayscale(100%) blur(4px) brightness(1.2);
      opacity: 0.45;
      z-index: 1;
      mix-blend-mode: multiply;
}

.card-bday-editorial .script-overlay {
      position: absolute;
      z-index: 10;
      font-family: 'Great Vibes', cursive;
      color: #8B1E1E;
      font-size: 5rem;
      top: 290px;
      left: -10px;
      transform: rotate(-10deg);
      text-shadow: 2px 2px 5px rgba(255, 255, 255, 0.5);
}

.card-bday-editorial .decor-arrows {
      position: absolute;
      top: 30px;
      left: 30px;
      display: flex;
      flex-direction: column;
      gap: 5px;
      color: #8B1E1E;
      font-size: 0.8rem;
      z-index: 10;
}

.card-bday-editorial .date-block {
      position: absolute;
      right: 25px;
      bottom: 80px;
      text-align: right;
      z-index: 10;
      color: #8B1E1E;
}

.card-bday-editorial .d-month {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      text-transform: uppercase;
      font-weight: 600;
      margin-bottom: 5px;
}

.card-bday-editorial .d-sub {
      font-family: 'Playfair Display', serif;
      font-size: 0.9rem;
      font-style: italic;
      margin-bottom: 5px;
}

.card-bday-editorial .d-num {
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      font-weight: 700;
      line-height: 0.8;
}

.card-bday-editorial .quote-block {
      position: absolute;
      bottom: 30px;
      left: 30px;
      max-width: 200px;
      display: flex;
      gap: 10px;
      z-index: 10;
      align-items: flex-start;
}

.card-bday-editorial .red-dot {
      display: inline-block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #8B1E1E;
      flex-shrink: 0;
      margin-top: 5px;
}

.card-bday-editorial .quote-block p {
      font-family: 'Inter', sans-serif;
      font-size: 0.75rem;
      color: #8B1E1E;
      line-height: 1.6;
}

/* BATCH 1: TYPOGRAPHY FOCUS (Cards 1-10) */

.card-bday-edit-1 {
      background: #EAE6DF;
}

.card-bday-edit-1 .card-inner {
      padding: 20px;
      text-align: center;
      justify-content: flex-end;
}

.card-bday-edit-1 .massive-bg-text {
      position: absolute;
      font-family: 'Inter', sans-serif;
      font-size: 15rem;
      font-weight: 900;
      color: #FFF;
      opacity: 0.5;
      top: 10%;
      left: -50%;
      line-height: 0.8;
      word-break: break-all;
      z-index: 1;
      pointer-events: none;
}

.card-bday-edit-1 .main-portrait {
      width: 90%;
      height: 60%;
      object-fit: cover;
      z-index: 2;
      border-radius: 4px;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
      margin: 0 auto 30px;
}

.card-bday-edit-1 .bottom-quote {
      z-index: 2;
      display: flex;
      gap: 10px;
      text-align: left;
      margin-bottom: 20px;
}

.card-bday-edit-1 .bottom-quote p {
      font-size: 0.8rem;
      font-family: 'Inter', sans-serif;
      color: #555;
}

.card-bday-edit-1 .red-dot {
      width: 8px;
      height: 8px;
      background: #8B1E1E;
      border-radius: 50%;
      margin-top: 5px;
      flex-shrink: 0;
}

.card-bday-edit-1 .date-stamp {
      font-family: 'Playfair Display', serif;
      color: #8B1E1E;
      font-size: 1.2rem;
      align-self: flex-end;
      z-index: 2;
}

.card-bday-edit-2 {
      background: #F4F0EA;
}

.card-bday-edit-2 .card-inner {
      padding: 40px;
      justify-content: space-between;
      align-items: flex-end;
}

.card-bday-edit-2 .small-portrait {
      width: 150px;
      height: 200px;
      object-fit: cover;
      align-self: flex-end;
      filter: grayscale(50%);
      border: 1px solid #ddd;
}

.card-bday-edit-2 .left-align-text {
      align-self: flex-start;
      text-align: left;
}

.card-bday-edit-2 h2 {
      font-family: 'Inter', sans-serif;
      font-size: 4rem;
      font-weight: 300;
      letter-spacing: -2px;
      margin-bottom: 15px;
}

.card-bday-edit-2 p {
      font-family: 'Playfair Display', serif;
      font-style: italic;
      color: #666;
      margin-bottom: 20px;
}

.card-bday-edit-2 .red-line {
      height: 1px;
      width: 40px;
      background: #8B1E1E;
      margin-bottom: 10px;
}

.card-bday-edit-2 span {
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      color: #8B1E1E;
      letter-spacing: 2px;
}

.card-bday-edit-3 {
      background: #FFF;
}

.card-bday-edit-3 .card-inner {
      padding: 0;
}

.card-bday-edit-3 .top-half {
      height: 50%;
      width: 100%;
      border-bottom: 3px solid #8B1E1E;
}

.card-bday-edit-3 .top-half img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: contrast(1.1) brightness(0.9);
}

.card-bday-edit-3 .bottom-half {
      height: 50%;
      background: #F9F6F0;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
}

.card-bday-edit-3 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3.5rem;
      line-height: 0.9;
      color: #333;
}

.card-bday-edit-3 .script-tag {
      position: absolute;
      font-family: 'Great Vibes', cursive;
      color: #8B1E1E;
      font-size: 4rem;
      top: 50%;
      transform: translateY(-50%) rotate(-5deg);
      opacity: 0.8;
}

.card-bday-edit-4 {
      background: #E5E1D8;
}

.card-bday-edit-4 .card-inner {
      flex-direction: row;
      padding: 20px;
}

.card-bday-edit-4 .side-strip {
      width: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-right: 1px solid #CCC;
      margin-right: 20px;
}

.card-bday-edit-4 .side-strip span {
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 4px;
      color: #8B1E1E;
}

.card-bday-edit-4 .main-content {
      flex: 1;
      position: relative;
      background: #FFF;
      padding: 10px;
}

.card-bday-edit-4 .main-content img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-4 .corner-date {
      position: absolute;
      bottom: -15px;
      right: -15px;
      background: #FFF;
      padding: 10px;
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      line-height: 0.8;
      font-weight: bold;
      color: #8B1E1E;
}

.card-bday-edit-5 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-5 .macro-shot {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: sepia(0.3) contrast(1.2);
}

.card-bday-edit-5 .typo-overlay {
      position: absolute;
      bottom: 30px;
      left: 20px;
}

.card-bday-edit-5 h2 {
      font-family: 'Inter', sans-serif;
      font-size: 3.5rem;
      font-weight: 800;
      color: #FFF;
      mix-blend-mode: overlay;
}

.card-bday-edit-5 .floating-text {
      position: absolute;
      top: 40px;
      right: 20px;
      text-align: right;
      border-top: 2px solid #8B1E1E;
      padding-top: 10px;
}

.card-bday-edit-5 .floating-text p {
      font-family: 'Playfair Display', serif;
      font-style: italic;
      color: #FFF;
      font-size: 1rem;
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.card-bday-edit-6 {
      background: #F8F4ED;
}

.card-bday-edit-6 .card-inner {
      padding: 30px;
      position: relative;
}

.card-bday-edit-6 .diag-bg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 50%;
      background: #E8E2D6;
      transform: skewY(-15deg);
      transform-origin: top left;
      z-index: 0;
}

.card-bday-edit-6 img {
      width: 80%;
      margin: auto;
      position: relative;
      z-index: 1;
      border-radius: 8px;
      box-shadow: 10px 10px 0 rgba(139, 30, 30, 0.1);
}

.card-bday-edit-6 .diag-text {
      position: absolute;
      top: 50%;
      left: -10%;
      transform: rotate(-15deg);
      font-family: 'Inter', sans-serif;
      font-size: 4rem;
      font-weight: 900;
      color: transparent;
      -webkit-text-stroke: 1px #8B1E1E;
      z-index: 2;
      opacity: 0.8;
}

.card-bday-edit-6 .red-box {
      position: absolute;
      bottom: 40px;
      right: 40px;
      background: #8B1E1E;
      padding: 10px 20px;
      z-index: 3;
}

.card-bday-edit-6 .red-box span {
      color: #FFF;
      font-family: 'Playfair Display', serif;
      letter-spacing: 5px;
}

.card-bday-edit-7 {
      background: #FFF;
}

.card-bday-edit-7 .card-inner {
      padding: 20px;
      position: relative;
      justify-content: space-between;
}

.card-bday-edit-7 .mag-title {
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      text-align: center;
      color: #111;
      position: absolute;
      top: 10px;
      width: 100%;
      left: 0;
      z-index: 1;
      letter-spacing: -2px;
}

.card-bday-edit-7 .mag-model {
      width: 100%;
      height: 75%;
      object-fit: cover;
      z-index: 2;
      margin-top: 60px;
}

.card-bday-edit-7 .mag-footer {
      display: flex;
      justify-content: space-between;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      color: #8B1E1E;
      border-top: 1px solid #8B1E1E;
      padding-top: 10px;
}

.card-bday-edit-8 {
      background: #EFEBE0;
}

.card-bday-edit-8 .card-inner {
      padding: 30px;
}

.card-bday-edit-8 .grid-layout {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 2fr 1fr;
      height: 100%;
      gap: 15px;
}

.card-bday-edit-8 .grid-img {
      grid-column: 1 / 3;
      grid-row: 1 / 2;
}

.card-bday-edit-8 .grid-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-8 .grid-empty {
      border: 1px dashed #8B1E1E;
      display: flex;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-8 .red-arrow {
      font-size: 2rem;
      color: #8B1E1E;
      font-family: 'Inter', sans-serif;
}

.card-bday-edit-8 .grid-text-large {
      font-family: 'Playfair Display', serif;
      font-size: 6rem;
      line-height: 1;
      color: #333;
      align-self: end;
}

.card-bday-edit-8 .grid-text-small {
      grid-column: 1 / 3;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      color: #555;
      text-transform: uppercase;
      border-top: 1px solid #CCC;
      padding-top: 10px;
}

.card-bday-edit-9 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-9 .full-bg {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-9 .diff-text {
      position: absolute;
      top: 40px;
      left: 20px;
      mix-blend-mode: difference;
      color: #FFF;
      z-index: 2;
}

.card-bday-edit-9 .diff-text h2 {
      font-family: 'Inter', sans-serif;
      font-size: 3rem;
      font-weight: 300;
      letter-spacing: 2px;
}

.card-bday-edit-9 .diff-date {
      position: absolute;
      bottom: 30px;
      right: 20px;
      mix-blend-mode: difference;
      color: #FFF;
      font-family: 'Inter', sans-serif;
      font-size: 0.9rem;
      letter-spacing: 5px;
      transform: rotate(-90deg);
      transform-origin: right bottom;
}

.card-bday-edit-10 {
      background: #FDFBF7;
}

.card-bday-edit-10 .card-inner {
      padding: 20px;
      align-items: center;
      justify-content: center;
      position: relative;
}

.card-bday-edit-10 .arch-text {
      width: 80%;
      position: absolute;
      top: 10%;
      fill: #8B1E1E;
      font-family: 'Inter', sans-serif;
      font-size: 10px;
      letter-spacing: 2px;
      text-transform: uppercase;
      animation: spin 20s linear infinite;
}

@keyframes spin {
      100% {
            transform: rotate(360deg);
      }
}

.card-bday-edit-10 .circle-mask {
      width: 220px;
      height: 220px;
      border-radius: 50%;
      overflow: hidden;
      z-index: 2;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

.card-bday-edit-10 .circle-mask img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-10 .bottom-serif {
      position: absolute;
      bottom: 40px;
      text-align: center;
}

.card-bday-edit-10 .red-serif {
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      color: #8B1E1E;
      font-style: italic;
}

/* BATCH 2: COLLAGE & LAYERING (Cards 11-20) */

.card-bday-edit-11 {
      background: #EAE6DF;
}

.card-bday-edit-11 .card-inner {
      padding: 40px 20px;
      align-items: center;
      justify-content: center;
      position: relative;
}

.card-bday-edit-11 .torn-top,
.card-bday-edit-11 .torn-bottom {
      position: absolute;
      width: 100%;
      height: 20px;
      background: #EAE6DF;
      z-index: 5;
}

.card-bday-edit-11 .torn-top {
      top: 0;
      left: 0;
      clip-path: polygon(0 0, 100% 0, 100% 10%, 95% 40%, 90% 10%, 85% 60%, 80% 20%, 75% 50%, 70% 10%, 65% 80%, 60% 30%, 55% 60%, 50% 15%, 45% 70%, 40% 20%, 35% 50%, 30% 10%, 25% 60%, 20% 20%, 15% 50%, 10% 10%, 5% 40%, 0 0);
}

.card-bday-edit-11 .torn-bottom {
      bottom: 0;
      left: 0;
      background: #FFF;
      clip-path: polygon(0 100%, 100% 100%, 100% 90%, 95% 60%, 90% 90%, 85% 40%, 80% 80%, 75% 50%, 70% 90%, 65% 20%, 60% 70%, 55% 40%, 50% 85%, 45% 30%, 40% 80%, 35% 50%, 30% 90%, 25% 40%, 20% 80%, 15% 50%, 10% 90%, 5% 60%, 0 100%);
}

.card-bday-edit-11 .collage-layer {
      width: 90%;
      position: relative;
      padding: 10px;
      background: #FFF;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
      transform: rotate(2deg);
      z-index: 1;
}

.card-bday-edit-11 .collage-layer img {
      width: 100%;
      height: 250px;
      object-fit: cover;
}

.card-bday-edit-11 .tape-strip {
      position: absolute;
      top: -10px;
      left: 50%;
      width: 60px;
      height: 20px;
      background: rgba(255, 255, 255, 0.7);
      transform: translateX(-50%) rotate(-3deg);
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
      z-index: 2;
}

.card-bday-edit-11 .torn-text {
      font-family: 'Playfair Display', serif;
      font-size: 3.5rem;
      color: #8B1E1E;
      margin-top: 30px;
      transform: rotate(-2deg);
      z-index: 2;
      position: relative;
}

.card-bday-edit-11 .torn-sub {
      font-family: 'Inter', sans-serif;
      font-size: 0.9rem;
      color: #666;
      text-transform: uppercase;
      letter-spacing: 2px;
      z-index: 2;
      position: relative;
}

.card-bday-edit-12 {
      background: #111;
}

.card-bday-edit-12 .card-inner {
      padding: 30px;
      align-items: center;
      justify-content: center;
      position: relative;
}

.card-bday-edit-12 .sil-bg {
      position: absolute;
      top: 10%;
      left: 10%;
      width: 80%;
      height: 80%;
      background: #8B1E1E;
      border-radius: 20px;
      filter: blur(40px);
      opacity: 0.4;
}

.card-bday-edit-12 img {
      width: 100%;
      height: 75%;
      object-fit: cover;
      filter: grayscale(100%) contrast(1.5) brightness(0.8);
      position: relative;
      z-index: 2;
      mix-blend-mode: screen;
}

.card-bday-edit-12 .sil-text {
      position: absolute;
      z-index: 3;
      color: #FFF;
      font-family: 'Inter', sans-serif;
      font-size: 2.8rem;
      letter-spacing: 12px;
      bottom: 15%;
      opacity: 0.9;
      text-align: center;
      left: 0;
      width: 100%;
}

.card-bday-edit-12 .sil-date {
      position: absolute;
      bottom: 20px;
      right: 20px;
      color: #8B1E1E;
      font-family: 'Playfair Display', serif;
      font-size: 1.2rem;
      z-index: 3;
}

.card-bday-edit-13 {
      background: #FFF;
}

.card-bday-edit-13 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-13 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-13 .fade-overlay {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 60%;
      background: linear-gradient(to top, #FDFAF5 20%, transparent 100%);
      z-index: 1;
}

.card-bday-edit-13 .fade-content {
      position: absolute;
      bottom: 40px;
      left: 0;
      width: 100%;
      text-align: center;
      z-index: 2;
}

.card-bday-edit-13 .fade-tag {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 6px;
      color: #8B1E1E;
      display: block;
      margin-bottom: 5px;
}

.card-bday-edit-13 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      color: #333;
      line-height: 0.8;
}

.card-bday-edit-14 {
      background: #E5E1D8;
}

.card-bday-edit-14 .card-inner {
      padding: 0;
      position: relative;
      background: #CABFB4;
}

.card-bday-edit-14 .base-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.7;
}

.card-bday-edit-14 .mirrored-img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scaleY(-1);
      opacity: 0.4;
      mix-blend-mode: overlay;
}

.card-bday-edit-14 .center-type {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      padding: 20px;
      border: 1px solid rgba(255, 255, 255, 0.5);
      backdrop-filter: blur(5px);
}

.card-bday-edit-14 h2 {
      font-family: 'Inter', sans-serif;
      font-size: 2.5rem;
      letter-spacing: 15px;
      margin-right: -15px;
      color: #FFF;
}

.card-bday-edit-15 {
      background: #F4F4F4;
}

.card-bday-edit-15 .card-inner {
      padding: 30px;
      display: flex;
      flex-direction: column;
      position: relative;
      justify-content: center;
}

.card-bday-edit-15 .mono-line {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50px;
      width: 1px;
      background: #CCC;
      z-index: 1;
}

.card-bday-edit-15 img {
      width: 80%;
      height: 60%;
      object-fit: cover;
      align-self: flex-end;
      filter: grayscale(100%);
      z-index: 2;
      box-shadow: -10px 10px 0 rgba(0, 0, 0, 0.03);
}

.card-bday-edit-15 .mono-text {
      margin-top: 30px;
      z-index: 2;
      padding-left: 30px;
}

.card-bday-edit-15 .mono-gray {
      font-family: 'Inter', sans-serif;
      font-size: 3.5rem;
      color: #999;
      line-height: 1;
      letter-spacing: -1px;
}

.card-bday-edit-15 .mono-red {
      font-family: 'Inter', sans-serif;
      font-size: 4rem;
      color: #8B1E1E;
      line-height: 0.9;
      letter-spacing: -2px;
}

.card-bday-edit-16 {
      background: #FDFBF7;
}

.card-bday-edit-16 .card-inner {
      padding: 40px;
      display: flex;
      justify-content: center;
      align-items: flex-start;
}

.card-bday-edit-16 .large-letter {
      font-family: 'Playfair Display', serif;
      font-size: 15rem;
      color: #EAE6DF;
      line-height: 0.8;
      margin-top: -20px;
}

.card-bday-edit-16 .script-across {
      font-family: 'Great Vibes', cursive;
      color: #8B1E1E;
      font-size: 5rem;
      margin-top: -80px;
      margin-left: 40px;
      margin-bottom: 20px;
      z-index: 2;
      position: relative;
}

.card-bday-edit-16 img {
      width: 100%;
      height: 50%;
      object-fit: cover;
      z-index: 1;
      position: relative;
}

.card-bday-edit-16 p {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      color: #666;
      margin-top: 20px;
      text-transform: uppercase;
      letter-spacing: 2px;
      text-align: center;
      width: 100%;
}

.card-bday-edit-17 {
      background: #E5E1D8;
      border: 2px solid #111;
      border-radius: 0;
      box-shadow: 8px 8px 0 #111;
}

.card-bday-edit-17 .card-inner {
      padding: 0;
}

.card-bday-edit-17 .brut-header {
      display: flex;
      justify-content: space-between;
      padding: 20px;
      border-bottom: 2px solid #111;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 1.2rem;
      color: #111;
}

.card-bday-edit-17 img {
      width: 100%;
      height: 75%;
      object-fit: cover;
      filter: contrast(1.2) grayscale(0.2);
}

.card-bday-edit-17 .brut-footer {
      padding: 20px;
      border-top: 2px solid #111;
      background: #8B1E1E;
      text-align: center;
}

.card-bday-edit-17 .brut-footer h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 4rem;
      color: #FFF;
      line-height: 1;
      letter-spacing: -2px;
}

.card-bday-edit-18 {
      background: #FFFFFF;
}

.card-bday-edit-18 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-bday-edit-18 .line-border {
      position: absolute;
      background: #8B1E1E;
}

.card-bday-edit-18 .line-border.top {
      top: 20px;
      left: 20px;
      right: 20px;
      height: 1px;
}

.card-bday-edit-18 .line-border.bottom {
      bottom: 20px;
      left: 20px;
      right: 20px;
      height: 1px;
}

.card-bday-edit-18 .line-border.left {
      top: 20px;
      bottom: 20px;
      left: 20px;
      width: 1px;
}

.card-bday-edit-18 .line-border.right {
      top: 20px;
      bottom: 20px;
      right: 20px;
      width: 1px;
}

.card-bday-edit-18 img {
      width: 80%;
      height: 70%;
      object-fit: cover;
}

.card-bday-edit-18 .micro-text {
      position: absolute;
      font-family: 'Inter', sans-serif;
      font-size: 10px;
      color: #8B1E1E;
      letter-spacing: 4px;
      writing-mode: vertical-rl;
}

.card-bday-edit-18 .left-micro {
      left: 8px;
      top: 30px;
      transform: rotate(180deg);
}

.card-bday-edit-18 .right-micro {
      right: 8px;
      bottom: 30px;
      transform: rotate(180deg);
}

.card-bday-edit-18 .center-serif {
      position: absolute;
      top: 10%;
      background: #FFF;
      padding: 0 10px;
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      color: #333;
}

.card-bday-edit-19 {
      background: #F2EFE9;
}

.card-bday-edit-19 .card-inner {
      padding: 30px;
      position: relative;
}

.card-bday-edit-19 .split-word {
      display: flex;
      flex-direction: column;
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 5rem;
      line-height: 0.85;
      color: #111;
      letter-spacing: -4px;
      z-index: 2;
      position: relative;
}

.card-bday-edit-19 .split-word span:nth-child(2) {
      padding-left: 20px;
      color: #8B1E1E;
}

.card-bday-edit-19 .split-word span:nth-child(3) {
      padding-left: 40px;
}

.card-bday-edit-19 img {
      position: absolute;
      right: 20px;
      bottom: 30px;
      width: 60%;
      height: 60%;
      object-fit: cover;
      z-index: 1;
}

.card-bday-edit-19 .corner-dot {
      position: absolute;
      bottom: 30px;
      left: 30px;
      width: 15px;
      height: 15px;
      background: #8B1E1E;
}

.card-bday-edit-20 {
      background: #FFF;
}

.card-bday-edit-20 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: flex-start;
}

.card-bday-edit-20 .beige-box {
      position: absolute;
      top: 10%;
      right: 10%;
      width: 70%;
      height: 60%;
      background: #EFEBE0;
      z-index: 1;
}

.card-bday-edit-20 .off-grid-img {
      width: 80%;
      height: 50%;
      object-fit: cover;
      z-index: 2;
      position: relative;
      margin-top: 40px;
      box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
}

.card-bday-edit-20 .overlap-title {
      z-index: 3;
      position: relative;
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      color: #8B1E1E;
      margin-top: -30px;
      margin-left: 30px;
      font-style: italic;
}

.card-bday-edit-20 .overlap-quote {
      z-index: 3;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      color: #555;
      text-transform: uppercase;
      letter-spacing: 3px;
      margin-top: 20px;
      padding-left: 30px;
}

/* BATCH 3: MIXED LAYOUTS (Cards 21-30) */

.card-bday-edit-21 {
      background: #E5E1D8;
}

.card-bday-edit-21 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: space-between;
}

.card-bday-edit-21 .wrap-typo {
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      line-height: 0.8;
      color: #8B1E1E;
      position: relative;
      z-index: 2;
}

.card-bday-edit-21 .offset-frame {
      position: absolute;
      top: 100px;
      right: 20px;
      width: 60%;
      height: 60%;
      background: #FFF;
      padding: 10px;
      box-shadow: 15px 15px 0 rgba(0, 0, 0, 0.05);
      z-index: 1;
}

.card-bday-edit-21 .offset-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: sepia(0.2);
}

.card-bday-edit-21 .polar-sub {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: #555;
      position: relative;
      z-index: 2;
      align-self: flex-start;
}

.card-bday-edit-22 {
      background: #FFF;
}

.card-bday-edit-22 .card-inner {
      padding: 15px;
}

.card-bday-edit-22 .four-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
      gap: 5px;
      height: 100%;
}

.card-bday-edit-22 .grid-cell {
      background: #EAE6DF;
      overflow: hidden;
      position: relative;
}

.card-bday-edit-22 .grid-cell img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: grayscale(100%);
}

.card-bday-edit-22 .typo-cell {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      background: #8B1E1E;
      color: #FFF;
      text-align: center;
}

.card-bday-edit-22 .typo-cell h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 4.5rem;
      line-height: 1;
      margin-bottom: 5px;
}

.card-bday-edit-22 .typo-cell span {
      font-family: 'Inter', sans-serif;
      letter-spacing: 4px;
      font-size: 0.7rem;
}

.card-bday-edit-23 {
      background: #111;
      padding: 10px;
}

.card-bday-edit-23 .card-inner {
      height: 100%;
      width: 100%;
      border: 1px solid #8B1E1E;
      position: relative;
      padding: 20px;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-23 .stamp-border {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      padding: 5px;
      background: url('data:image/svg+xml;utf8,<svg width="100%25" height="100%25" xmlns="http://www.w3.org/2000/svg"><text x="5%25" y="15" font-family="monospace" font-size="12" fill="%238B1E1E">BIRTHDAY ISSUE * BIRTHDAY ISSUE * BIRTHDAY ISSUE</text></svg>');
      pointer-events: none;
}

.card-bday-edit-23 .stamp-img {
      width: 90%;
      height: 80%;
      object-fit: cover;
}

.card-bday-edit-23 .stamp-text {
      position: absolute;
      bottom: 40px;
      color: #FFF;
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      letter-spacing: 10px;
}

.card-bday-edit-24 {
      background: #FFF;
}

.card-bday-edit-24 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-24 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-24 .central-strip {
      position: absolute;
      top: 40%;
      width: 100%;
      background: rgba(250, 247, 242, 0.9);
      backdrop-filter: blur(10px);
      padding: 30px 0;
      text-align: center;
      border-top: 1px solid #8B1E1E;
      border-bottom: 1px solid #8B1E1E;
}

.card-bday-edit-24 .central-strip h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 3.5rem;
      letter-spacing: -1px;
      color: #8B1E1E;
      margin-bottom: 5px;
}

.card-bday-edit-24 .central-strip p {
      font-family: 'Inter', sans-serif;
      font-size: 0.75rem;
      color: #333;
      letter-spacing: 4px;
}

.card-bday-edit-25 {
      background: #F8F4ED;
}

.card-bday-edit-25 .card-inner {
      padding: 30px;
      position: relative;
      align-items: center;
      justify-content: space-between;
}

.card-bday-edit-25 .float-title {
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      color: #8B1E1E;
      font-style: italic;
      position: relative;
      z-index: 2;
}

.card-bday-edit-25 .title-bottom {
      align-self: flex-end;
}

.card-bday-edit-25 .cutout-img {
      position: absolute;
      top: 20%;
      width: 90%;
      height: 60%;
      object-fit: contain;
      filter: drop-shadow(0 20px 20px rgba(0, 0, 0, 0.1));
      z-index: 1;
}

.card-bday-edit-26 {
      background: #FFF;
      border: 10px solid #EAE6DF;
}

.card-bday-edit-26 .card-inner {
      padding: 20px;
      position: relative;
}

.card-bday-edit-26 .corner-top-left {
      position: absolute;
      top: 20px;
      left: 20px;
}

.card-bday-edit-26 .corner-top-left h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 2rem;
      color: #8B1E1E;
      line-height: 1;
}

.card-bday-edit-26 .center-tiny-img {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 150px;
      height: 220px;
      object-fit: cover;
}

.card-bday-edit-26 .corner-bottom-right {
      position: absolute;
      bottom: 20px;
      right: 20px;
      text-align: right;
}

.card-bday-edit-26 .corner-bottom-right p {
      font-family: 'Playfair Display', serif;
      color: #555;
      font-style: italic;
}

.card-bday-edit-27 {
      background: #EAE6DF;
}

.card-bday-edit-27 .card-inner {
      padding: 20px;
      position: relative;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-27 .frame-one {
      width: 70%;
      height: 50%;
      position: absolute;
      top: 10%;
      right: 10%;
      background: #FFF;
      padding: 5px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      z-index: 1;
}

.card-bday-edit-27 .frame-two {
      width: 60%;
      height: 40%;
      position: absolute;
      bottom: 15%;
      left: 10%;
      background: #FFF;
      padding: 5px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      z-index: 2;
}

.card-bday-edit-27 .frame-one img,
.card-bday-edit-27 .frame-two img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: grayscale(100%);
}

.card-bday-edit-27 .overlap-h2 {
      position: absolute;
      top: 45%;
      left: 0;
      width: 100%;
      text-align: center;
      z-index: 3;
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      color: #8B1E1E;
      text-shadow: 2px 2px 0 #FFF;
}

.card-bday-edit-28 {
      background: #F8F4ED;
}

.card-bday-edit-28 .card-inner {
      align-items: center;
      justify-content: center;
}

.card-bday-edit-28 .tiny-text-box {
      width: 120px;
      border-left: 2px solid #8B1E1E;
      padding-left: 15px;
}

.card-bday-edit-28 .tiny-text-box h2 {
      font-family: 'Inter', sans-serif;
      font-size: 2.5rem;
      color: #111;
      margin-bottom: 10px;
}

.card-bday-edit-28 .tiny-text-box p {
      font-family: 'Inter', sans-serif;
      font-size: 0.75rem;
      color: #555;
      line-height: 1.5;
      margin-bottom: 20px;
}

.card-bday-edit-28 .red-dot {
      display: block;
      width: 8px;
      height: 8px;
      background: #8B1E1E;
      border-radius: 50%;
}

.card-bday-edit-29 {
      background: #FFF;
}

.card-bday-edit-29 .card-inner {
      padding: 40px;
      justify-content: flex-start;
}

.card-bday-edit-29 .poem-img {
      width: 120px;
      height: 160px;
      object-fit: cover;
      filter: sepia(0.5);
      margin-bottom: 40px;
}

.card-bday-edit-29 .poem-block {
      border-left: 2px solid #8B1E1E;
      padding-left: 20px;
}

.card-bday-edit-29 .poem-block p {
      font-family: monospace;
      font-size: 0.95rem;
      color: #333;
      line-height: 1.8;
      margin-bottom: 5px;
}

.card-bday-edit-30 {
      background: #FFF;
}

.card-bday-edit-30 .card-inner {
      padding: 0;
      flex-direction: row;
}

.card-bday-edit-30 .split-left {
      width: 50%;
      height: 100%;
      border-right: 1px solid #EAE6DF;
}

.card-bday-edit-30 .split-left img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-30 .split-right {
      width: 50%;
      height: 100%;
      background: #F8F4ED;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      position: relative;
}

.card-bday-edit-30 .v-split-text {
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 3rem;
      writing-mode: vertical-rl;
      text-orientation: mixed;
      color: #8B1E1E;
      letter-spacing: 5px;
}

.card-bday-edit-30 .v-split-date {
      position: absolute;
      bottom: 20px;
      font-family: 'Playfair Display', serif;
      font-size: 0.8rem;
      color: #555;
}

/* BATCH 4: GRANULAR SPECIFIC LAYOUTS (Cards 31-40) */

.card-bday-edit-31 {
      background: #FFF;
}

.card-bday-edit-31 .card-inner {
      padding: 40px;
      position: relative;
}

.card-bday-edit-31 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      color: #8B1E1E;
      font-style: italic;
      line-height: 1;
      z-index: 2;
      position: relative;
}

.card-bday-edit-31 .stair-1 {
      margin-left: 0;
}

.card-bday-edit-31 .stair-2 {
      margin-left: 20%;
}

.card-bday-edit-31 .stair-3 {
      margin-left: 40%;
}

.card-bday-edit-31 .stair-4 {
      margin-left: 60%;
}

.card-bday-edit-31 img {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 80%;
      height: 60%;
      object-fit: cover;
      z-index: 1;
}

.card-bday-edit-32 {
      background: #E5E1D8;
}

.card-bday-edit-32 .card-inner {
      padding: 0;
}

.card-bday-edit-32 .top-img {
      width: 100%;
      height: 50%;
}

.card-bday-edit-32 .top-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-32 .bottom-typo {
      height: 50%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 40px;
}

.card-bday-edit-32 .small-tag {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      color: #8B1E1E;
      letter-spacing: 2px;
      margin-bottom: 20px;
      border-bottom: 1px solid #8B1E1E;
      padding-bottom: 5px;
      display: inline-block;
      width: fit-content;
}

.card-bday-edit-32 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3.5rem;
      line-height: 0.9;
      color: #111;
}

.card-bday-edit-33 {
      background: #FDFBF7;
}

.card-bday-edit-33 .card-inner {
      padding: 30px;
      position: relative;
      justify-content: flex-end;
}

.card-bday-edit-33 .pin-img {
      position: absolute;
      top: 30px;
      right: 30px;
      width: 120px;
      height: 150px;
      object-fit: cover;
      border: 4px solid #FFF;
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
      transform: rotate(5deg);
      z-index: 2;
}

.card-bday-edit-33 .pin-text {
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 5rem;
      line-height: 0.8;
      color: #EAE6DF;
      z-index: 1;
      margin-bottom: 50px;
}

.card-bday-edit-34 {
      background: #FFF;
}

.card-bday-edit-34 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-34 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-34 .center-col {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 60px;
      background: rgba(255, 255, 255, 0.9);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 40px;
      box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.card-bday-edit-34 .center-col span {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      color: #8B1E1E;
}

.card-bday-edit-35 {
      background: #FAF8F5;
      border: 1px solid #CCC;
}

.card-bday-edit-35 .card-inner {
      padding: 30px;
      position: relative;
      border: 2px solid #333;
      height: calc(100% - 20px);
      width: calc(100% - 20px);
      margin: 10px;
}

.card-bday-edit-35 .doc-header {
      border-bottom: 2px solid #333;
      padding-bottom: 10px;
      margin-bottom: 20px;
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
}

.card-bday-edit-35 .doc-header h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 1.5rem;
      color: #333;
}

.card-bday-edit-35 .doc-header span {
      font-family: monospace;
      color: #8B1E1E;
      font-size: 0.9rem;
}

.card-bday-edit-35 .doc-line {
      font-family: monospace;
      font-size: 1rem;
      border-bottom: 1px dashed #CCC;
      padding-bottom: 5px;
      margin-bottom: 15px;
      display: flex;
}

.card-bday-edit-35 .label {
      width: 60px;
      color: #777;
}

.card-bday-edit-35 .val {
      color: #111;
}

.card-bday-edit-35 .doc-img {
      width: 100%;
      height: 200px;
      object-fit: cover;
      margin-top: 20px;
      filter: grayscale(100%) contrast(1.2);
}

.card-bday-edit-35 .doc-stamp {
      position: absolute;
      bottom: 40px;
      right: 20px;
      border: 3px solid #8B1E1E;
      color: #8B1E1E;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 1.5rem;
      padding: 5px 10px;
      transform: rotate(-15deg);
      opacity: 0.8;
}

.card-bday-edit-36 {
      background: #111;
}

.card-bday-edit-36 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-36 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: blur(3px) brightness(0.6);
}

.card-bday-edit-36 .quote-overlay-box {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 40px;
}

.card-bday-edit-36 .q-mark {
      font-family: 'Playfair Display', serif;
      font-size: 8rem;
      color: #8B1E1E;
      line-height: 0.5;
      margin-bottom: 20px;
      opacity: 0.5;
}

.card-bday-edit-36 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      color: #FFF;
      line-height: 1.2;
      font-style: italic;
}

.card-bday-edit-37 {
      background: #EFEBE0;
}

.card-bday-edit-37 .card-inner {
      padding: 0;
      display: flex;
      flex-direction: row;
}

.card-bday-edit-37 .thick-margin {
      width: 60px;
      height: 100%;
      background: #EFEBE0;
      display: flex;
      align-items: center;
      justify-content: center;
      border-right: 1px solid #8B1E1E;
}

.card-bday-edit-37 .thick-margin span {
      font-family: 'Inter', sans-serif;
      font-size: 0.9rem;
      color: #8B1E1E;
      letter-spacing: 5px;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
}

.card-bday-edit-37 img {
      width: calc(100% - 60px);
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-38 {
      background: #FFF;
}

.card-bday-edit-38 .card-inner {
      justify-content: center;
      align-items: center;
      position: relative;
}

.card-bday-edit-38 .circle-c1 {
      width: 220px;
      height: 220px;
      border-radius: 50%;
      overflow: hidden;
      position: absolute;
      top: 20%;
      left: 10%;
      z-index: 1;
}

.card-bday-edit-38 .circle-c1 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-38 .circle-c2 {
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: #8B1E1E;
      display: flex;
      justify-content: center;
      align-items: center;
      position: absolute;
      bottom: 25%;
      right: 10%;
      z-index: 2;
      mix-blend-mode: multiply;
}

.card-bday-edit-38 .circle-c2 h2 {
      font-family: 'Inter', sans-serif;
      font-size: 5rem;
      color: #EAE6DF;
}

.card-bday-edit-39 {
      background: #8B1E1E;
}

.card-bday-edit-39 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: center;
}

.card-bday-edit-39 .red-bg-title {
      font-family: 'Playfair Display', serif;
      font-size: 6.5rem;
      line-height: 0.8;
      color: #FFF;
      z-index: 1;
}

.card-bday-edit-39 img {
      position: absolute;
      bottom: 40px;
      right: 40px;
      width: 160px;
      height: 220px;
      object-fit: cover;
      filter: grayscale(100%);
      border: 5px solid #FFF;
      z-index: 2;
}

.card-bday-edit-40 {
      background: #E5E1D8;
}

.card-bday-edit-40 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
      overflow: hidden;
}

.card-bday-edit-40 .numbg {
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.3;
      z-index: 0;
}

.card-bday-edit-40 .huge-number {
      font-family: 'Inter', sans-serif;
      font-size: 25rem;
      font-weight: 900;
      color: #FFF;
      line-height: 1;
      letter-spacing: -20px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      opacity: 0.6;
      z-index: 1;
}

.card-bday-edit-40 .over-text-box {
      z-index: 2;
      background: #8B1E1E;
      padding: 15px 30px;
}

.card-bday-edit-40 .over-text-box p {
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      color: #FFF;
      letter-spacing: 5px;
}

/* BATCH 5: ABSTRACT & TEXTURAL (Cards 41-50) */

.card-bday-edit-41 {
      background: #EAE6DF;
}

.card-bday-edit-41 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-bday-edit-41 .grain-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"><filter id="noiseFilter"><feTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%25" height="100%25" filter="url(%23noiseFilter)"/></svg>');
      opacity: 0.2;
      z-index: 3;
      pointer-events: none;
}

.card-bday-edit-41 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.8;
      z-index: 1;
      filter: sepia(0.3);
}

.card-bday-edit-41 .grain-typo {
      position: absolute;
      z-index: 2;
      text-align: center;
      color: #FFF;
      filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.5));
}

.card-bday-edit-41 .grain-typo h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3.5rem;
      letter-spacing: 5px;
}

.card-bday-edit-41 .grain-typo span {
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      color: #EAE6DF;
      letter-spacing: 10px;
}

.card-bday-edit-42 {
      background: #FFF;
      border: 20px solid #F4F0EA;
}

.card-bday-edit-42 .card-inner {
      padding: 0;
      flex-direction: row;
}

.card-bday-edit-42 .stamp-col {
      width: 50px;
      background: #FFF;
      display: flex;
      flex-direction: column;
      justify-content: space-around;
      padding: 20px 0;
      border-right: 1px dashed #8B1E1E;
}

.card-bday-edit-42 .stmp {
      font-family: monospace;
      font-size: 0.8rem;
      color: #8B1E1E;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      letter-spacing: 2px;
      text-align: center;
}

.card-bday-edit-42 img {
      width: calc(100% - 50px);
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-43 {
      background: #E5E1D8;
}

.card-bday-edit-43 .card-inner {
      padding: 30px;
      position: relative;
      justify-content: center;
}

.card-bday-edit-43 img {
      width: 100%;
      height: 75%;
      object-fit: cover;
      filter: grayscale(50%);
}

.card-bday-edit-43 .offset-shadow-txt {
      position: absolute;
      bottom: 80px;
      left: 20px;
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      color: #FFF;
      font-style: italic;
      text-shadow: 4px 4px 0 #8B1E1E;
      z-index: 2;
}

.card-bday-edit-44 {
      background: #FFF;
}

.card-bday-edit-44 .card-inner {
      padding: 0;
}

.card-bday-edit-44 .split-top {
      height: 25%;
      background: #EFEBE0;
      display: flex;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-44 .split-top h2 {
      font-family: 'Inter', sans-serif;
      font-size: 1.5rem;
      letter-spacing: 12px;
      color: #8B1E1E;
}

.card-bday-edit-44 .split-mid {
      height: 50%;
}

.card-bday-edit-44 .split-mid img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-44 .split-bot {
      height: 25%;
      background: #8B1E1E;
      display: flex;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-44 .split-bot p {
      font-family: 'Playfair Display', serif;
      color: #FFF;
      font-size: 2.5rem;
      font-style: italic;
}

.card-bday-edit-45 {
      background: #FDFBF7;
}

.card-bday-edit-45 .card-inner {
      padding: 20px;
      position: relative;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-45 .box-path-wrap {
      position: absolute;
      width: 90%;
      height: 90%;
      border: 1px solid #EAE6DF;
}

.card-bday-edit-45 .box-path-text {
      position: absolute;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      color: #8B1E1E;
      letter-spacing: 6px;
      white-space: nowrap;
}

.card-bday-edit-45 .t-top {
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      background: #FDFBF7;
      padding: 0 10px;
}

.card-bday-edit-45 .t-bottom {
      bottom: -10px;
      left: 50%;
      transform: translateX(-50%);
      background: #FDFBF7;
      padding: 0 10px;
}

.card-bday-edit-45 .t-left {
      left: -10px;
      top: 50%;
      transform: translateY(-50%) rotate(-90deg);
      background: #FDFBF7;
      padding: 0 10px;
}

.card-bday-edit-45 .t-right {
      right: -10px;
      top: 50%;
      transform: translateY(-50%) rotate(90deg);
      background: #FDFBF7;
      padding: 0 10px;
}

.card-bday-edit-45 .box-center-img {
      width: 75%;
      height: 75%;
      object-fit: cover;
      z-index: 2;
      filter: contrast(1.1);
}

.card-bday-edit-46 {
      background: #E5E1D8;
      overflow: hidden;
}

.card-bday-edit-46 .card-inner {
      padding: 30px;
      position: relative;
      justify-content: flex-end;
}

.card-bday-edit-46 .bg-texture-char {
      font-family: 'Playfair Display', serif;
      font-size: 40rem;
      color: #FFF;
      position: absolute;
      top: -10%;
      left: -20%;
      line-height: 0.8;
      opacity: 0.4;
      z-index: 1;
      pointer-events: none;
}

.card-bday-edit-46 img {
      width: 100%;
      height: 80%;
      object-fit: cover;
      z-index: 2;
      position: relative;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

.card-bday-edit-46 .btm-label {
      position: relative;
      z-index: 2;
      margin-top: 20px;
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      letter-spacing: 8px;
      color: #8B1E1E;
      text-align: center;
}

.card-bday-edit-47 {
      background: #111;
}

.card-bday-edit-47 .card-inner {
      padding: 0;
      position: relative;
}

.card-bday-edit-47 .blur-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: blur(8px) brightness(0.7);
      transform: scale(1.1);
}

.card-bday-edit-47 .sharp-box {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: #FFF;
      padding: 30px 40px;
      text-align: center;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.card-bday-edit-47 .sharp-box h2 {
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      color: #8B1E1E;
      margin-bottom: 5px;
}

.card-bday-edit-47 .sharp-box p {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 3px;
      color: #333;
}

.card-bday-edit-48 {
      background: #F4F0EA;
}

.card-bday-edit-48 .card-inner {
      padding: 20px;
      position: relative;
      align-items: center;
      justify-content: center;
      overflow: hidden;
}

.card-bday-edit-48 .diag-split-box {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;
      z-index: 1;
}

.card-bday-edit-48 .diag-half-red {
      width: 150%;
      height: 150%;
      background: #8B1E1E;
      transform: rotate(45deg);
      position: absolute;
      top: 30%;
      left: -20%;
}

.card-bday-edit-48 img {
      width: 85%;
      height: 85%;
      object-fit: cover;
      z-index: 2;
      position: relative;
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.card-bday-edit-48 .tone-text {
      position: absolute;
      z-index: 3;
      top: 40px;
      left: 40px;
      font-family: 'Inter', sans-serif;
      font-size: 5rem;
      color: #FFF;
      line-height: 1;
      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
      font-weight: 900;
}

.card-bday-edit-49 {
      background: #EAE6DF;
}

.card-bday-edit-49 .card-inner {
      padding: 0;
      display: flex;
      flex-direction: row;
}

.card-bday-edit-49 .spine {
      width: 40px;
      background: #FFF;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 5px 0 15px rgba(0, 0, 0, 0.05);
      z-index: 2;
      position: relative;
}

.card-bday-edit-49 .spine span {
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      color: #111;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
}

.card-bday-edit-49 .cover-content {
      flex: 1;
      padding: 20px;
      position: relative;
}

.card-bday-edit-49 .cover-masthead {
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      text-align: center;
      color: #8B1E1E;
      margin-bottom: 20px;
}

.card-bday-edit-49 .cover-content img {
      width: 100%;
      height: calc(100% - 80px);
      object-fit: cover;
      border-radius: 2px;
}

.card-bday-edit-50 {
      background: #F8F4ED;
}

.card-bday-edit-50 .card-inner {
      padding: 40px;
      position: relative;
      align-items: center;
      justify-content: center;
}

.card-bday-edit-50 .geo-square {
      width: 100%;
      height: 60%;
      position: relative;
      z-index: 1;
}

.card-bday-edit-50 .geo-square img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-bday-edit-50 .geo-circle {
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: #8B1E1E;
      position: absolute;
      bottom: 10%;
      right: 10%;
      z-index: 2;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border: 4px solid #F8F4ED;
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.card-bday-edit-50 .geo-circle h2 {
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      color: #FFF;
      line-height: 1;
}

.card-bday-edit-50 .geo-circle span {
      font-family: 'Inter', sans-serif;
      font-size: 0.6rem;
      color: #EFEBE0;
      letter-spacing: 2px;
}

/* BATCH 6 (PURPLE FLORAL BATCH 1): CORE PORTRAIT & FLORAL FRAMING (Cards 51-60) */

.card-purple-edit-51 {
      background: #E6E1EB;
}

.card-purple-edit-51 .card-inner {
      padding: 30px;
      position: relative;
      justify-content: flex-end;
}

.card-purple-edit-51 .bg-flower {
      position: absolute;
      top: -10%;
      left: -20%;
      width: 140%;
      height: 70%;
      object-fit: cover;
      opacity: 0.3;
      filter: blur(2px) sepia(0.2) hue-rotate(250deg);
      z-index: 1;
}

.card-purple-edit-51 .main-portrait {
      width: 90%;
      height: 70%;
      object-fit: cover;
      position: relative;
      z-index: 2;
      margin-bottom: 20px;
      box-shadow: 0 15px 35px rgba(107, 76, 154, 0.2);
      border-radius: 4px;
}

.card-purple-edit-51 .typo-box {
      z-index: 3;
      padding-left: 20px;
}

.card-purple-edit-51 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      color: #4A3B69;
      line-height: 1;
      letter-spacing: -1px;
}

.card-purple-edit-51 span {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 5px;
      color: #786494;
}

.card-purple-edit-52 {
      background: #F4F1F8;
}

.card-purple-edit-52 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-52 .diag-portrait {
      width: 80%;
      height: 60%;
      object-fit: cover;
      transform: rotate(-10deg);
      z-index: 2;
      box-shadow: -10px 15px 25px rgba(107, 76, 154, 0.15);
}

.card-purple-edit-52 .diag-floral-1 {
      position: absolute;
      top: -5%;
      left: -10%;
      width: 70%;
      height: 40%;
      object-fit: cover;
      transform: rotate(15deg);
      z-index: 1;
      opacity: 0.6;
      mix-blend-mode: multiply;
}

.card-purple-edit-52 .diag-floral-2 {
      position: absolute;
      bottom: 5%;
      right: -15%;
      width: 80%;
      height: 50%;
      object-fit: cover;
      transform: rotate(-25deg);
      z-index: 3;
      opacity: 0.8;
}

.card-purple-edit-52 .diag-text {
      position: absolute;
      z-index: 4;
      font-family: 'Inter', sans-serif;
      font-size: 4rem;
      color: #FFF;
      line-height: 0.8;
      font-weight: 900;
      top: 15%;
      left: 10%;
      text-shadow: 2px 4px 10px rgba(0, 0, 0, 0.2);
}

.card-purple-edit-53 {
      background: #EBE8F0;
}

.card-purple-edit-53 .card-inner {
      padding: 25px;
      position: relative;
}

.card-purple-edit-53 .arch-container {
      width: 100%;
      height: 80%;
      border-radius: 200px 200px 0 0;
      overflow: hidden;
      position: relative;
      z-index: 1;
}

.card-purple-edit-53 .arch-portrait {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-53 .arch-floral-overlay {
      position: absolute;
      top: -20px;
      right: -30px;
      width: 60%;
      height: 50%;
      object-fit: contain;
      z-index: 2;
      filter: drop-shadow(-5px 10px 15px rgba(0, 0, 0, 0.2));
      transform: rotate(10deg);
}

.card-purple-edit-53 .arch-typo {
      text-align: center;
      margin-top: 25px;
}

.card-purple-edit-53 .arch-typo p {
      font-family: 'Playfair Display', serif;
      font-size: 1.2rem;
      font-style: italic;
      color: #5C4A7A;
      letter-spacing: 2px;
}

.card-purple-edit-54 {
      background: #FAF9FC;
}

.card-purple-edit-54 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-54 .top-empty {
      height: 35%;
      display: flex;
      align-items: center;
      justify-content: center;
}

.card-purple-edit-54 .top-empty h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 3rem;
      text-align: center;
      color: #6B4C9A;
      line-height: 1;
      letter-spacing: -2px;
}

.card-purple-edit-54 .sit-portrait {
      width: 100%;
      height: 65%;
      object-fit: cover;
      z-index: 1;
      position: relative;
}

.card-purple-edit-54 .bottom-floral-bed {
      position: absolute;
      bottom: -5%;
      left: 0;
      width: 100%;
      height: 40%;
      object-fit: cover;
      z-index: 2;
      opacity: 0.9;
      filter: contrast(1.1) brightness(0.9);
}

.card-purple-edit-55 {
      background: #DFDCE6;
}

.card-purple-edit-55 .card-inner {
      padding: 0;
      position: relative;
      align-items: center;
      justify-content: flex-end;
      overflow: hidden;
}

.card-purple-edit-55 .top-floral-hang {
      position: absolute;
      top: -10%;
      left: -10%;
      width: 120%;
      height: 50%;
      object-fit: cover;
      z-index: 2;
      filter: drop-shadow(0 15px 20px rgba(0, 0, 0, 0.15));
}

.card-purple-edit-55 .center-tiny-portrait {
      width: 65%;
      height: 55%;
      object-fit: cover;
      z-index: 1;
      border: 15px solid #F4F1F8;
      box-shadow: 0 10px 30px rgba(74, 59, 105, 0.2);
      margin-bottom: 20%;
}

.card-purple-edit-55 .bottom-typo-clean {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
}

.card-purple-edit-55 .bottom-typo-clean span {
      font-family: 'Inter', sans-serif;
      font-size: 0.75rem;
      color: #5C4A7A;
      letter-spacing: 6px;
      text-transform: uppercase;
}

.card-purple-edit-56 {
      background: #F1EFF5;
}

.card-purple-edit-56 .card-inner {
      padding: 20px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-56 .center-full-portrait {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
}

.card-purple-edit-56 .edge-f-top {
      position: absolute;
      top: 0;
      left: 0;
      width: 150%;
      height: 40%;
      object-fit: cover;
      z-index: 2;
      opacity: 0.8;
      mix-blend-mode: overlay;
      transform: rotate(180deg);
}

.card-purple-edit-56 .edge-f-bottom {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 150%;
      height: 40%;
      object-fit: cover;
      z-index: 2;
      opacity: 0.8;
      mix-blend-mode: color-burn;
}

.card-purple-edit-56 .center-glow-text {
      position: absolute;
      z-index: 3;
      font-family: 'Playfair Display', serif;
      font-size: 6rem;
      color: #FFF;
      font-style: italic;
      text-shadow: 0 0 20px rgba(107, 76, 154, 0.6), 0 5px 10px rgba(0, 0, 0, 0.3);
}

.card-purple-edit-57 {
      background: #Eae7F0;
}

.card-purple-edit-57 .card-inner {
      padding: 0;
      display: flex;
      flex-direction: row;
}

.card-purple-edit-57 .left-heavy-portrait {
      width: 65%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-57 .right-heavy-typo {
      width: 35%;
      padding: 30px 10px;
      display: flex;
      flex-direction: column;
      align-items: center;
}

.card-purple-edit-57 .right-heavy-typo h2 {
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      color: #4A3B69;
      margin-bottom: -20px;
}

.card-purple-edit-57 .right-heavy-typo p {
      font-family: 'Inter', sans-serif;
      margin-top: 40px;
      color: #786494;
      font-size: 0.9rem;
      letter-spacing: 4px;
      writing-mode: vertical-rl;
}

.card-purple-edit-57 .right-stem {
      position: absolute;
      bottom: 0;
      right: 20px;
      height: 60%;
      object-fit: contain;
      z-index: 2;
      filter: drop-shadow(-5px 5px 5px rgba(0, 0, 0, 0.1));
      pointer-events: none;
}

.card-purple-edit-58 {
      background: #FFF;
}

.card-purple-edit-58 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-58 .full-frame-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 1;
}

.card-purple-edit-58 .blur-overlay-bot {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 40%;
      background: linear-gradient(to top, rgba(107, 76, 154, 0.8), transparent);
      z-index: 2;
      backdrop-filter: blur(5px);
}

.card-purple-edit-58 .fg-blurred-flower {
      position: absolute;
      bottom: -10%;
      right: -20%;
      width: 90%;
      height: 60%;
      object-fit: cover;
      z-index: 3;
      filter: blur(4px) opacity(0.8);
      transform: rotate(-25deg);
}

.card-purple-edit-58 .soft-float-text {
      position: absolute;
      bottom: 60px;
      left: 30px;
      z-index: 4;
      font-family: 'Inter', sans-serif;
      font-weight: 300;
      font-size: 3rem;
      letter-spacing: 15px;
      color: #FFF;
      text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.card-purple-edit-59 {
      background: #DFDCE6;
}

.card-purple-edit-59 .card-inner {
      padding: 30px;
      align-items: center;
      justify-content: center;
      position: relative;
}

.card-purple-edit-59 .circle-mask-wrap {
      width: 280px;
      height: 280px;
      border-radius: 50%;
      overflow: hidden;
      position: relative;
      z-index: 1;
      border: 2px solid #FFF;
      box-shadow: 0 10px 30px rgba(107, 76, 154, 0.15);
}

.card-purple-edit-59 .circle-mask-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-59 .break-circle-floral {
      position: absolute;
      top: 15%;
      right: -10%;
      width: 200px;
      height: 200px;
      object-fit: contain;
      z-index: 2;
      filter: drop-shadow(0 15px 15px rgba(0, 0, 0, 0.2));
}

.card-purple-edit-59 .top-arch-text {
      position: absolute;
      top: 20%;
      left: 50%;
      transform: translateX(-50%);
      width: 320px;
      z-index: 3;
      pointer-events: none;
}

.card-purple-edit-60 {
      background: #EBE8F0;
}

.card-purple-edit-60 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-60 .scrap-portrait {
      width: 85%;
      height: 65%;
      object-fit: cover;
      transform: rotate(3deg);
      z-index: 1;
      box-shadow: 2px 2px 0 rgba(107, 76, 154, 0.1), 5px 10px 20px rgba(0, 0, 0, 0.1);
}

.card-purple-edit-60 .tape-strip {
      position: absolute;
      width: 100px;
      height: 30px;
      background: rgba(255, 255, 255, 0.6);
      backdrop-filter: blur(2px);
      z-index: 3;
}

.card-purple-edit-60 .top-tape {
      top: 12%;
      left: 10%;
      transform: rotate(-15deg);
}

.card-purple-edit-60 .bot-tape {
      bottom: 20%;
      right: 10%;
      transform: rotate(10deg);
}

.card-purple-edit-60 .scrap-flower {
      position: absolute;
      bottom: 25%;
      left: 0%;
      width: 150px;
      height: 150px;
      object-fit: container;
      z-index: 2;
      filter: drop-shadow(-5px 10px 10px rgba(0, 0, 0, 0.2));
}

.card-purple-edit-60 .scrap-note {
      position: absolute;
      bottom: 50px;
      right: 30px;
      font-family: 'Caveat', cursive;
      font-size: 2rem;
      color: #4A3B69;
      transform: rotate(-5deg);
      z-index: 4;
}

/* BATCH 7 (PURPLE FLORAL BATCH 2): COLLAGE & MULTI-IMAGE FOCUS (Cards 61-70) */

.card-purple-edit-61 {
      background: #E6E1EB;
}

.card-purple-edit-61 .card-inner {
      padding: 40px;
      justify-content: space-between;
      position: relative;
}

.card-purple-edit-61 .vert-slice {
      width: 30%;
      height: 75%;
      overflow: hidden;
      position: absolute;
      top: 10%;
      box-shadow: 0 10px 20px rgba(74, 59, 105, 0.2);
}

.card-purple-edit-61 .vert-slice img {
      width: 350%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-61 .slice-1 {
      left: 5%;
      transform: translateY(10px);
}

.card-purple-edit-61 .slice-1 img {
      transform: translateX(0%);
}

.card-purple-edit-61 .slice-2 {
      left: 35%;
      transform: translateY(-10px);
}

.card-purple-edit-61 .slice-2 img {
      transform: translateX(-33.33%);
}

.card-purple-edit-61 .slice-3 {
      left: 65%;
      transform: translateY(20px);
}

.card-purple-edit-61 .slice-3 img {
      transform: translateX(-66.66%);
}

.card-purple-edit-61 .slice-flower-overlay {
      position: absolute;
      bottom: 15%;
      right: 10%;
      width: 50%;
      height: 40%;
      object-fit: contain;
      z-index: 2;
      filter: drop-shadow(-5px 5px 10px rgba(0, 0, 0, 0.2));
      opacity: 0.9;
}

.card-purple-edit-61 .slice-title {
      position: absolute;
      bottom: 30px;
      left: 30px;
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      color: #4A3B69;
      z-index: 3;
}

.card-purple-edit-62 {
      background: #4A3B69;
}

.card-purple-edit-62 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-62 .pb-bg-blur {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.4;
      mix-blend-mode: screen;
      filter: blur(3px);
}

.card-purple-edit-62 .photobooth-strip {
      width: 140px;
      background: #FFF;
      padding: 10px 10px 25px 10px;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
      z-index: 2;
      transform: rotate(-3deg);
      display: flex;
      flex-direction: column;
      gap: 10px;
}

.card-purple-edit-62 .photobooth-strip img {
      width: 100%;
      height: 160px;
      object-fit: cover;
      filter: grayscale(20%) contrast(1.1);
}

.card-purple-edit-62 .pb-text {
      font-family: monospace;
      font-size: 1rem;
      color: #555;
      text-align: center;
      margin-top: 10px;
      letter-spacing: 3px;
}

.card-purple-edit-63 {
      background: #F4F1F8;
}

.card-purple-edit-63 .card-inner {
      padding: 20px;
      position: relative;
}

.card-purple-edit-63 .asym-main {
      width: 85%;
      height: 75%;
      object-fit: cover;
      border-radius: 4px;
      box-shadow: 0 10px 20px rgba(107, 76, 154, 0.15);
}

.card-purple-edit-63 .tiny-box {
      width: 120px;
      height: 120px;
      position: absolute;
      border: 4px solid #FFF;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      z-index: 2;
}

.card-purple-edit-63 .tiny-box img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-63 .tb-1 {
      bottom: 80px;
      left: 20px;
      transform: rotate(-5deg);
}

.card-purple-edit-63 .tb-2 {
      bottom: 40px;
      left: 120px;
      transform: rotate(8deg);
}

.card-purple-edit-63 .asym-side-text {
      position: absolute;
      right: 20px;
      top: 30%;
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 2.5rem;
      color: #5C4A7A;
      writing-mode: vertical-rl;
      letter-spacing: 15px;
}

.card-purple-edit-64 {
      background: #FAF9FC;
}

.card-purple-edit-64 .card-inner {
      padding: 0;
      position: relative;
      align-items: center;
      justify-content: center;
}

.card-purple-edit-64 .tilt-frame {
      width: 220px;
      height: 280px;
      background: #FFF;
      padding: 15px;
      box-shadow: 0 15px 35px rgba(107, 76, 154, 0.2);
      position: absolute;
}

.card-purple-edit-64 .tilt-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-64 .frame-left {
      top: 15%;
      left: 10%;
      transform: rotate(-8deg);
      z-index: 1;
}

.card-purple-edit-64 .frame-right {
      bottom: 20%;
      right: 10%;
      transform: rotate(12deg);
      z-index: 2;
}

.card-purple-edit-64 .tilt-orchid {
      position: absolute;
      top: 40%;
      left: 20%;
      width: 180px;
      height: 180px;
      object-fit: contain;
      z-index: 3;
      filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.15));
}

.card-purple-edit-65 {
      background: #EBE8F0;
}

.card-purple-edit-65 .card-inner {
      padding: 30px;
      position: relative;
}

.card-purple-edit-65 .corner-cluster {
      position: absolute;
      top: -10px;
      right: -10px;
      width: 85%;
      height: 60%;
      z-index: 1;
}

.card-purple-edit-65 .cc-color-block {
      position: absolute;
      top: 0;
      right: 0;
      width: 80%;
      height: 90%;
      background: #6B4C9A;
      z-index: 1;
}

.card-purple-edit-65 .cc-portrait {
      position: absolute;
      top: 40px;
      right: 40px;
      width: 70%;
      height: 85%;
      object-fit: cover;
      z-index: 3;
      box-shadow: -10px 10px 20px rgba(0, 0, 0, 0.2);
}

.card-purple-edit-65 .cc-floral {
      position: absolute;
      top: 40%;
      left: -10%;
      width: 60%;
      height: 60%;
      object-fit: cover;
      z-index: 2;
      opacity: 0.9;
}

.card-purple-edit-65 .bot-left-script {
      position: absolute;
      bottom: 40px;
      left: 30px;
      font-family: 'Great Vibes', cursive;
      font-size: 3.5rem;
      color: #4A3B69;
      width: 60%;
      line-height: 1;
}

.card-purple-edit-66 {
      background: #DFDCE6;
}

.card-purple-edit-66 .card-inner {
      padding: 0;
      align-items: center;
      justify-content: center;
      position: relative;
}

.card-purple-edit-66 .framed-bg-blur {
      position: absolute;
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: blur(10px) brightness(0.9);
      z-index: 1;
}

.card-purple-edit-66 .center-strict-box {
      width: 75%;
      height: 65%;
      border: 2px solid #FFF;
      padding: 15px;
      position: relative;
      z-index: 2;
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(5px);
}

.card-purple-edit-66 .center-strict-box img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-66 .csb-label {
      position: absolute;
      bottom: -25px;
      left: 50%;
      transform: translateX(-50%);
      background: #FFF;
      padding: 10px 30px;
      font-family: 'Inter', sans-serif;
      font-size: 1.2rem;
      color: #6B4C9A;
      font-weight: 800;
      letter-spacing: 5px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.card-purple-edit-67 {
      background: #111;
}

.card-purple-edit-67 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-67 .mirror-base-blur {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: blur(15px) opacity(0.6);
      z-index: 1;
}

.card-purple-edit-67 .mirror-top-sharp {
      position: absolute;
      top: 10%;
      left: 10%;
      width: 80%;
      height: 80%;
      object-fit: cover;
      z-index: 2;
      box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
      opacity: 0.9;
      mix-blend-mode: luminosity;
}

.card-purple-edit-67 .mirror-accents {
      position: absolute;
      bottom: 50px;
      width: 100%;
      text-align: center;
      z-index: 3;
}

.card-purple-edit-67 .mirror-accents span {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      color: #DFDCE6;
      letter-spacing: 15px;
      font-weight: 300;
}

.card-purple-edit-68 {
      background: #FFF;
      border: 15px solid #F4F1F8;
}

.card-purple-edit-68 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-68 .tiny-center-img {
      width: 140px;
      height: 200px;
      object-fit: cover;
      z-index: 2;
      position: relative;
      box-shadow: 0 10px 20px rgba(107, 76, 154, 0.1);
}

.card-purple-edit-68 .solitary-lavender {
      position: absolute;
      top: 30%;
      right: 25%;
      width: 100px;
      height: 150px;
      object-fit: contain;
      z-index: 1;
      opacity: 0.7;
}

.card-purple-edit-68 .minimal-year {
      position: absolute;
      bottom: 40px;
      font-family: 'Inter', sans-serif;
      font-size: 0.75rem;
      color: #786494;
      letter-spacing: 4px;
}

.card-purple-edit-69 {
      background: #4A3B69;
}

.card-purple-edit-69 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-69 .fade-base-flower {
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 1;
      filter: contrast(1.2);
}

.card-purple-edit-69 .fade-gradient-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(to bottom, transparent 30%, #E6E1EB 80%);
      z-index: 2;
}

.card-purple-edit-69 .fade-top-model {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 70%;
      object-fit: cover;
      z-index: 3;
      mix-blend-mode: multiply;
      opacity: 0.85;
}

.card-purple-edit-69 .fade-title {
      position: absolute;
      top: 10%;
      right: 10%;
      font-family: 'Playfair Display', serif;
      font-size: 6rem;
      color: #FFF;
      line-height: 0.8;
      opacity: 0.9;
      z-index: 4;
      text-align: right;
}

.card-purple-edit-70 {
      background: #EBE8F0;
}

.card-purple-edit-70 .card-inner {
      padding: 0;
      justify-content: center;
      align-items: center;
      position: relative;
}

.card-purple-edit-70 .macro-crop-img {
      width: 120%;
      height: 120%;
      object-fit: cover;
      position: absolute;
      top: -10%;
      left: -10%;
      z-index: 1;
}

.card-purple-edit-70 .macro-petals {
      position: absolute;
      bottom: -20px;
      left: -20px;
      width: 110%;
      height: 60%;
      object-fit: cover;
      z-index: 2;
      filter: blur(1px) drop-shadow(0 -10px 20px rgba(0, 0, 0, 0.2));
      opacity: 0.9;
}

.card-purple-edit-70 .macro-text-box {
      position: absolute;
      top: 30px;
      right: 30px;
      background: rgba(255, 255, 255, 0.8);
      backdrop-filter: blur(5px);
      padding: 5px 15px;
      border: 1px solid #6B4C9A;
      z-index: 3;
}

.card-purple-edit-70 .macro-text-box p {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      color: #4A3B69;
      letter-spacing: 4px;
      margin: 0;
}

/* BATCH 8 (PURPLE FLORAL BATCH 3): SOFT BLENDS & DEPTH (Cards 71-80) */

.card-purple-edit-71 {
      background: #FFF;
}

.card-purple-edit-71 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-71 .top-sharp-model {
      width: 100%;
      height: 70%;
      object-fit: cover;
      z-index: 1;
}

.card-purple-edit-71 .soft-bot-blur-box {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 45%;
      background: rgba(230, 225, 235, 0.7);
      backdrop-filter: blur(10px);
      z-index: 2;
      padding: 30px;
      display: flex;
      align-items: center;
}

.card-purple-edit-71 .blur-lavender {
      position: absolute;
      top: -30%;
      right: 10%;
      width: 150px;
      height: 150px;
      object-fit: contain;
      z-index: 3;
      filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.1));
      opacity: 0.9;
}

.card-purple-edit-71 .blur-text-overlay {
      z-index: 4;
      position: relative;
}

.card-purple-edit-71 .blur-text-overlay h2 {
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      color: #4A3B69;
      margin-bottom: 5px;
      line-height: 1;
}

.card-purple-edit-71 .blur-text-overlay p {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 5px;
      color: #786494;
}

.card-purple-edit-72 {
      background: #E6E1EB;
}

.card-purple-edit-72 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-72 .intersect-square {
      width: 200px;
      height: 200px;
      position: absolute;
      top: 15%;
      left: 10%;
      z-index: 2;
      border: 3px solid #FFF;
      box-shadow: 10px 10px 20px rgba(74, 59, 105, 0.15);
}

.card-purple-edit-72 .intersect-square img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-72 .intersect-circle {
      width: 180px;
      height: 180px;
      border-radius: 50%;
      overflow: hidden;
      position: absolute;
      bottom: 20%;
      right: 10%;
      z-index: 1;
      opacity: 0.8;
      filter: grayscale(30%);
}

.card-purple-edit-72 .intersect-circle img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-72 .intersect-typo {
      position: absolute;
      z-index: 3;
      font-family: 'Playfair Display', serif;
      font-size: 4rem;
      font-style: italic;
      color: #4A3B69;
      top: 45%;
      left: 5%;
}

.card-purple-edit-73 {
      background: #DFDCE6;
      overflow: hidden;
}

.card-purple-edit-73 .card-inner {
      padding: 0;
      position: relative;
      justify-content: flex-end;
      align-items: center;
}

.card-purple-edit-73 .huge-bg-text {
      position: absolute;
      top: 10%;
      left: -20%;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 15rem;
      color: #FFF;
      opacity: 0.3;
      line-height: 0.8;
      z-index: 1;
      pointer-events: none;
}

.card-purple-edit-73 .pop-out-model {
      width: 90%;
      height: 80%;
      object-fit: cover;
      border-radius: 6px 6px 0 0;
      z-index: 2;
      position: relative;
}

.card-purple-edit-73 .wrap-floral-fg {
      position: absolute;
      bottom: 10%;
      left: -10%;
      width: 120%;
      height: 40%;
      object-fit: cover;
      z-index: 3;
      filter: drop-shadow(0 -10px 15px rgba(0, 0, 0, 0.2));
}

.card-purple-edit-74 {
      background: #2A1B38;
}

.card-purple-edit-74 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-74 .plum-model {
      width: 70%;
      height: 75%;
      object-fit: cover;
      filter: grayscale(100%) contrast(1.2);
      opacity: 0.6;
      mix-blend-mode: luminosity;
      z-index: 2;
}

.card-purple-edit-74 .plum-wash {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: radial-gradient(circle at center, transparent 30%, #4A3B69 90%);
      z-index: 3;
      mix-blend-mode: overlay;
}

.card-purple-edit-74 .plum-typo {
      position: absolute;
      bottom: 40px;
      width: 100%;
      text-align: center;
      z-index: 4;
}

.card-purple-edit-74 .plum-typo p {
      font-family: 'Inter', sans-serif;
      font-size: 1.2rem;
      letter-spacing: 12px;
      color: #E6E1EB;
}

.card-purple-edit-75 {
      background: #F4F1F8;
}

.card-purple-edit-75 .card-inner {
      padding: 30px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-75 .shift-frame {
      width: 220px;
      height: 320px;
      position: absolute;
      box-shadow: 0 10px 30px rgba(107, 76, 154, 0.15);
}

.card-purple-edit-75 .sf-1 {
      border: 2px solid #6B4C9A;
      top: 15%;
      left: 15%;
      z-index: 1;
}

.card-purple-edit-75 .sf-2 {
      background: #FFF;
      bottom: 15%;
      right: 15%;
      z-index: 2;
}

.card-purple-edit-75 .sf-2 img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.9;
}

.card-purple-edit-75 .sf-flower {
      position: absolute;
      top: 10%;
      right: 10%;
      width: 140px;
      height: 140px;
      object-fit: contain;
      z-index: 3;
      filter: drop-shadow(-5px 10px 10px rgba(0, 0, 0, 0.2));
}

.card-purple-edit-76 {
      background: #FFF;
      border: 15px solid #EBE8F0;
}

.card-purple-edit-76 .card-inner {
      padding: 0;
      position: relative;
      display: flex;
      flex-direction: column;
}

.card-purple-edit-76 .massive-top-margin {
      height: 40%;
      display: flex;
      justify-content: center;
      align-items: flex-start;
      padding-top: 40px;
}

.card-purple-edit-76 .massive-top-margin p {
      font-family: 'Inter', sans-serif;
      font-size: 0.75rem;
      letter-spacing: 3px;
      color: #786494;
}

.card-purple-edit-76 .bottom-snap-img {
      width: 100%;
      height: 60%;
      object-fit: cover;
}

.card-purple-edit-76 .overlap-top-text {
      position: absolute;
      top: 25%;
      left: 50%;
      transform: translateX(-50%);
      font-family: 'Playfair Display', serif;
      font-size: 6rem;
      color: #4A3B69;
      z-index: 2;
}

.card-purple-edit-77 {
      background: #DFDCE6;
}

.card-purple-edit-77 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-77 .radial-fade-wrap {
      width: 280px;
      height: 280px;
      position: relative;
      z-index: 1;
      mask-image: radial-gradient(circle, black 40%, transparent 70%);
      -webkit-mask-image: radial-gradient(circle, black 40%, transparent 70%);
}

.card-purple-edit-77 .rf-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-77 .rf-orchids {
      position: absolute;
      bottom: 20%;
      right: 10%;
      width: 150px;
      height: 220px;
      object-fit: contain;
      z-index: 2;
      opacity: 0.85;
      filter: drop-shadow(-5px 5px 10px rgba(0, 0, 0, 0.1));
      transform: rotate(-15deg);
}

.card-purple-edit-78 {
      background: #EBE8F0;
}

.card-purple-edit-78 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-78 .diag-split-top {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      clip-path: polygon(0 0, 100% 0, 100% 40%, 0 60%);
      z-index: 2;
}

.card-purple-edit-78 .diag-split-top img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-78 .diag-split-bot {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 60%;
      background: #6B4C9A;
      z-index: 1;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 30px;
}

.card-purple-edit-78 .diag-split-bot img {
      position: absolute;
      top: 10%;
      right: -10%;
      width: 70%;
      height: 70%;
      object-fit: cover;
      opacity: 0.5;
      mix-blend-mode: screen;
}

.card-purple-edit-78 .diag-split-bot h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3.5rem;
      color: #E6E1EB;
      font-style: italic;
      position: relative;
      z-index: 2;
}

.card-purple-edit-79 {
      background: #F4F1F8;
}

.card-purple-edit-79 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-79 .thin-border-box {
      width: 100%;
      height: 80%;
      border: 1px solid #786494;
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
}

.card-purple-edit-79 .tbb-img {
      width: 80%;
      height: 70%;
      object-fit: cover;
      opacity: 0.9;
      filter: sepia(0.2);
}

.card-purple-edit-79 .tbb-text {
      position: absolute;
      bottom: -20px;
      background: #F4F1F8;
      padding: 0 15px;
      font-family: 'Inter', sans-serif;
      font-size: 1.5rem;
      letter-spacing: 10px;
      color: #4A3B69;
}

.card-purple-edit-79 .tbb-lavender {
      position: absolute;
      top: 15%;
      right: 5%;
      width: 120px;
      height: 180px;
      object-fit: contain;
      z-index: 2;
      filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.1));
      transform: rotate(10deg);
}

.card-purple-edit-80 {
      background: #DFDCE6;
}

.card-purple-edit-80 .card-inner {
      padding: 30px;
      position: relative;
      align-items: flex-end;
}

.card-purple-edit-80 .float-model {
      position: absolute;
      top: 10%;
      left: 10%;
      width: 65%;
      height: 50%;
      object-fit: cover;
      z-index: 1;
      border-radius: 5px;
      box-shadow: 0 15px 40px rgba(107, 76, 154, 0.2);
}

.card-purple-edit-80 .float-text-stagger {
      font-family: 'Playfair Display', serif;
      font-size: 4.5rem;
      color: #4A3B69;
      z-index: 2;
      margin-bottom: 20px;
      position: relative;
}

.card-purple-edit-80 .fs-1 {
      margin-left: 20px;
}

.card-purple-edit-80 .fs-2 {
      margin-left: 60px;
      font-style: italic;
}

.card-purple-edit-80 .fs-3 {
      margin-left: 40px;
      color: #786494;
}

/* BATCH 9 (PURPLE FLORAL BATCH 4): GEOMETRIC & MICRO-DETAILS (Cards 81-90) */

.card-purple-edit-81 {
      background: #EBE8F0;
}

.card-purple-edit-81 .card-inner {
      padding: 25px;
      position: relative;
      justify-content: flex-start;
}

.card-purple-edit-81 .four-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 10px;
      width: 100%;
      height: 75%;
}

.card-purple-edit-81 .fg-item {
      border-radius: 4px;
      overflow: hidden;
      position: relative;
}

.card-purple-edit-81 .fg-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-81 .fg-1 {
      transform: translateY(15px);
}

.card-purple-edit-81 .fg-2 {
      transform: translateY(0);
}

.card-purple-edit-81 .fg-3 {
      transform: translateY(5px);
}

.card-purple-edit-81 .fg-4 {
      background: #6B4C9A;
      display: flex;
      justify-content: center;
      align-items: center;
      transform: translateY(-10px);
}

.card-purple-edit-81 .fg-4 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 5rem;
      color: #FFF;
      margin: 0;
}

.card-purple-edit-81 .bottom-cap {
      position: absolute;
      bottom: 30px;
      left: 30px;
}

.card-purple-edit-81 .bottom-cap p {
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 4px;
      color: #4A3B69;
}

.card-purple-edit-82 {
      background: #FAF9FC;
}

.card-purple-edit-82 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-82 .circle-window {
      width: 100%;
      height: 60%;
      border-radius: 0 0 50% 50%;
      overflow: hidden;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
}

.card-purple-edit-82 .circle-window img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-82 .cw-petals {
      position: absolute;
      top: 50%;
      left: 10%;
      width: 100px;
      height: 150px;
      object-fit: contain;
      z-index: 2;
      opacity: 0.8;
      filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.1));
      transform: rotate(-20deg);
}

.card-purple-edit-82 .cw-text {
      position: absolute;
      bottom: 40px;
      width: 100%;
      text-align: center;
      z-index: 3;
}

.card-purple-edit-82 .cw-text h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      color: #6B4C9A;
      margin-bottom: 5px;
      letter-spacing: 5px;
}

.card-purple-edit-82 .cw-text p {
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      color: #786494;
      letter-spacing: 8px;
}

.card-purple-edit-83 {
      background: #2A1B38;
}

.card-purple-edit-83 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-83 .film-bg {
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.3;
      mix-blend-mode: luminosity;
      z-index: 1;
}

.card-purple-edit-83 .film-edge {
      position: absolute;
      left: 20px;
      top: 10%;
      height: 80%;
      width: 80px;
      display: flex;
      flex-direction: column;
      gap: 15px;
      z-index: 2;
}

.card-purple-edit-83 .film-edge img {
      width: 100%;
      height: 100px;
      object-fit: cover;
      border: 4px solid #FFF;
      border-radius: 2px;
}

.card-purple-edit-83 .film-label {
      position: absolute;
      right: 20px;
      bottom: 40px;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 3.5rem;
      color: #FFF;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      letter-spacing: 10px;
      z-index: 3;
}

.card-purple-edit-84 {
      background: #DFDCE6;
}

.card-purple-edit-84 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-84 .polaroid-bg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0.5;
      filter: blur(5px);
      z-index: 1;
}

.card-purple-edit-84 .polaroid {
      width: 200px;
      background: #FFF;
      padding: 15px 15px 50px 15px;
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
      position: absolute;
}

.card-purple-edit-84 .polaroid img {
      width: 100%;
      height: 200px;
      object-fit: cover;
}

.card-purple-edit-84 .p-back {
      top: 20%;
      left: 15%;
      transform: rotate(-8deg);
      z-index: 2;
      opacity: 0.7;
      filter: contrast(1.2) grayscale(30%);
}

.card-purple-edit-84 .p-front {
      bottom: 20%;
      right: 15%;
      transform: rotate(5deg);
      z-index: 3;
}

.card-purple-edit-84 .p-caption {
      font-family: 'Caveat', cursive;
      font-size: 1.5rem;
      color: #4A3B69;
      text-align: center;
      margin-top: 15px;
}

.card-purple-edit-85 {
      background: #E6E1EB;
}

.card-purple-edit-85 .card-inner {
      padding: 0;
      justify-content: center;
      align-items: center;
      position: relative;
}

.card-purple-edit-85 .diamond-cut {
      width: 220px;
      height: 220px;
      transform: rotate(45deg);
      overflow: hidden;
      z-index: 1;
      border: 2px solid #6B4C9A;
}

.card-purple-edit-85 .diamond-cut img {
      width: 150%;
      height: 150%;
      object-fit: cover;
      transform: rotate(-45deg) scale(1.2);
      transform-origin: center;
}

.card-purple-edit-85 .diamond-orchid {
      position: absolute;
      bottom: 20%;
      right: -20%;
      width: 250px;
      height: 250px;
      object-fit: contain;
      z-index: 2;
      opacity: 0.8;
      mix-blend-mode: multiply;
      transform: rotate(15deg);
}

.card-purple-edit-86 {
      background: #FFF;
}

.card-purple-edit-86 .card-inner {
      padding: 0;
      display: flex;
      flex-direction: column;
      position: relative;
}

.card-purple-edit-86 .half-img-top {
      width: 100%;
      height: 50%;
}

.card-purple-edit-86 .half-img-top img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-86 .half-solid-bot {
      width: 100%;
      height: 50%;
      background: #4A3B69;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-86 .half-solid-bot h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 2.5rem;
      letter-spacing: 12px;
      color: #E6E1EB;
      text-align: center;
}

.card-purple-edit-86 .half-tiny-floral {
      position: absolute;
      top: -30px;
      right: 30px;
      width: 60px;
      height: 60px;
      object-fit: contain;
      z-index: 2;
}

.card-purple-edit-87 {
      background: #F4F1F8;
}

.card-purple-edit-87 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-87 .stamp-bg-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: grayscale(100%) contrast(1.1) brightness(1.2);
      z-index: 1;
}

.card-purple-edit-87 .stamp {
      width: 100px;
      height: 120px;
      background: #FFF;
      padding: 8px;
      border: 1px dashed #CCC;
      position: absolute;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      z-index: 3;
}

.card-purple-edit-87 .stamp img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-87 .st-1 {
      top: 20%;
      left: 15%;
      transform: rotate(-10deg);
}

.card-purple-edit-87 .st-2 {
      bottom: 25%;
      right: 20%;
      transform: rotate(15deg);
      display: flex;
      justify-content: center;
      align-items: center;
      background: #6B4C9A;
}

.card-purple-edit-87 .st-2 p {
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      color: #FFF;
      margin: 0;
}

.card-purple-edit-87 .stamp-bg-text {
      position: absolute;
      top: 15%;
      right: 10%;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 4rem;
      color: rgba(107, 76, 154, 0.4);
      z-index: 2;
      writing-mode: vertical-rl;
}

.card-purple-edit-88 {
      background: #FFF;
}

.card-purple-edit-88 .card-inner {
      padding: 25px;
      position: relative;
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
}

.card-purple-edit-88 .margin-note-img {
      width: 85%;
      height: 85%;
      object-fit: cover;
      z-index: 1;
}

.card-purple-edit-88 .margin-note-right {
      position: absolute;
      right: 15px;
      top: 30px;
      height: 85%;
      display: flex;
      align-items: center;
}

.card-purple-edit-88 .margin-note-right p {
      font-family: monospace;
      font-size: 0.7rem;
      color: #786494;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      letter-spacing: 2px;
}

.card-purple-edit-88 .margin-note-bot {
      position: absolute;
      bottom: 25px;
      left: 25px;
      width: 85%;
      display: flex;
      justify-content: space-between;
}

.card-purple-edit-88 .margin-note-bot span {
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      font-weight: 600;
      color: #4A3B69;
      letter-spacing: 1px;
}

.card-purple-edit-89 {
      background: #EBE8F0;
}

.card-purple-edit-89 .card-inner {
      padding: 0;
      position: relative;
      display: flex;
}

.card-purple-edit-89 .vert-bar {
      width: 25%;
      height: 100%;
      background: #111;
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 2;
}

.card-purple-edit-89 .vert-bar h2 {
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 2.5rem;
      color: #FFF;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      letter-spacing: 10px;
}

.card-purple-edit-89 .vbar-model {
      width: 75%;
      height: 100%;
      object-fit: cover;
      z-index: 1;
}

.card-purple-edit-89 .vbar-floral {
      position: absolute;
      bottom: 10%;
      left: 15%;
      width: 50%;
      height: 30%;
      object-fit: cover;
      z-index: 3;
      mix-blend-mode: color-burn;
      opacity: 0.8;
}

.card-purple-edit-90 {
      background: #DFDCE6;
}

.card-purple-edit-90 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
      overflow: hidden;
}

.card-purple-edit-90 .outline-bg-model {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: brightness(0.8) contrast(1.1);
      z-index: 1;
}

.card-purple-edit-90 .outline-huge-text {
      position: absolute;
      z-index: 2;
      font-family: 'Playfair Display', serif;
      font-size: 6.5rem;
      font-style: italic;
      color: transparent;
      -webkit-text-stroke: 2px #EBE8F0;
      transform: rotate(-15deg);
      line-height: 0.8;
      opacity: 0.9;
}

.card-purple-edit-90 .outline-bot-flowers {
      position: absolute;
      bottom: -5%;
      right: -10%;
      width: 120%;
      height: 50%;
      object-fit: cover;
      z-index: 3;
      opacity: 0.85;
      filter: drop-shadow(0 -10px 20px rgba(0, 0, 0, 0.3));
}

/* BATCH 10 (PURPLE FLORAL BATCH 5): ASYMMETRICAL & MIXED EXPERIMENTAL (Cards 91-100) */

.card-purple-edit-91 {
      background: #E6E1EB;
}

.card-purple-edit-91 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-91 .off-arch {
      width: 60%;
      height: 75%;
      border-radius: 200px 200px 0 0;
      overflow: hidden;
      position: absolute;
      left: 10%;
      bottom: 0;
      z-index: 1;
}

.card-purple-edit-91 .off-arch img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-91 .off-square {
      width: 160px;
      height: 160px;
      position: absolute;
      top: 15%;
      right: 10%;
      z-index: 2;
      box-shadow: -10px 10px 20px rgba(0, 0, 0, 0.15);
}

.card-purple-edit-91 .off-square img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-91 .off-text {
      position: absolute;
      bottom: 40px;
      right: 20px;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 5rem;
      color: #6B4C9A;
      z-index: 3;
}

.card-purple-edit-92 {
      background: #FAF9FC;
}

.card-purple-edit-92 .card-inner {
      padding: 20px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-92 .tri-pol {
      width: 140px;
      height: 170px;
      background: #FFF;
      padding: 10px 10px 30px 10px;
      box-shadow: 0 10px 20px rgba(107, 76, 154, 0.1);
      position: absolute;
}

.card-purple-edit-92 .tri-pol img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-92 .tp-1 {
      top: 10%;
      left: 10%;
      transform: rotate(-10deg);
      z-index: 1;
}

.card-purple-edit-92 .tp-2 {
      top: 35%;
      right: 10%;
      transform: rotate(15deg);
      z-index: 3;
}

.card-purple-edit-92 .tp-3 {
      bottom: 20%;
      left: 20%;
      transform: rotate(-5deg);
      z-index: 2;
}

.card-purple-edit-92 .tri-text {
      position: absolute;
      bottom: 30px;
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      color: #4A3B69;
      z-index: 4;
      letter-spacing: 5px;
}

.card-purple-edit-93 {
      background: #FFF;
      border: 20px solid #EBE8F0;
}

.card-purple-edit-93 .card-inner {
      padding: 0;
      display: flex;
      flex-direction: row;
}

.card-purple-edit-93 .dt-left {
      width: 50%;
      height: 100%;
}

.card-purple-edit-93 .dt-left img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: sepia(0.3) hue-rotate(220deg);
}

.card-purple-edit-93 .dt-right {
      width: 50%;
      height: 100%;
      background: #6B4C9A;
      display: flex;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-93 .dt-right p {
      font-family: 'Inter', sans-serif;
      font-size: 1.5rem;
      letter-spacing: 15px;
      color: #E6E1EB;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
}

.card-purple-edit-94 {
      background: #DFDCE6;
}

.card-purple-edit-94 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-94 .ring-out {
      width: 300px;
      height: 300px;
      border-radius: 50%;
      border: 2px dashed #6B4C9A;
      padding: 15px;
      position: absolute;
      z-index: 1;
      opacity: 0.5;
}

.card-purple-edit-94 .ring-out img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 50%;
}

.card-purple-edit-94 .ring-in {
      width: 180px;
      height: 180px;
      border-radius: 50%;
      position: absolute;
      z-index: 2;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.card-purple-edit-94 .ring-in img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 50%;
}

.card-purple-edit-94 .ring-typo {
      position: absolute;
      top: 15%;
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      color: #4A3B69;
      z-index: 3;
      letter-spacing: 10px;
}

.card-purple-edit-95 {
      background: #FAF9FC;
}

.card-purple-edit-95 .card-inner {
      padding: 40px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-95 span {
      position: absolute;
      font-family: 'Inter', sans-serif;
      font-size: 0.6rem;
      letter-spacing: 3px;
      color: #786494;
      z-index: 3;
}

.card-purple-edit-95 .tm-top-l {
      top: 30px;
      left: 30px;
}

.card-purple-edit-95 .tm-top-r {
      top: 30px;
      right: 30px;
}

.card-purple-edit-95 .tm-center-img {
      width: 150px;
      height: 200px;
      object-fit: cover;
      z-index: 1;
      border: 1px solid #EBE8F0;
      padding: 10px;
      background: #FFF;
}

.card-purple-edit-95 .tm-orchid {
      position: absolute;
      bottom: 35%;
      right: 15%;
      width: 120px;
      height: 120px;
      object-fit: contain;
      z-index: 2;
      opacity: 0.8;
}

.card-purple-edit-95 .tm-bot-c {
      position: absolute;
      bottom: 40px;
      font-family: monospace;
      font-size: 1.2rem;
      color: #4A3B69;
      letter-spacing: 8px;
}

.card-purple-edit-96 {
      background: #2A1B38;
}

.card-purple-edit-96 .card-inner {
      padding: 0;
      position: relative;
}

.card-purple-edit-96 .dmo-base {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: brightness(0.6) sepia(0.5) hue-rotate(220deg);
      z-index: 1;
}

.card-purple-edit-96 .dmo-mask {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      clip-path: polygon(0 0, 100% 0, 100% 50%, 0 80%);
      z-index: 2;
}

.card-purple-edit-96 .dmo-mask img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-97 {
      background: #E6E1EB;
}

.card-purple-edit-97 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-97 .ex-blur-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: blur(20px) contrast(1.5) grayscale(20%);
      z-index: 1;
      opacity: 0.7;
}

.card-purple-edit-97 .ex-sharp-box {
      width: 80%;
      height: 250px;
      background: #FFF;
      position: absolute;
      z-index: 2;
      display: flex;
      justify-content: center;
      align-items: center;
      box-shadow: 0 20px 40px rgba(74, 59, 105, 0.3);
}

.card-purple-edit-97 .ex-sharp-box p {
      font-family: 'Inter', sans-serif;
      font-size: 1.2rem;
      font-weight: 800;
      letter-spacing: 12px;
      color: #4A3B69;
}

.card-purple-edit-97 .ex-sharp-flower {
      position: absolute;
      bottom: -20px;
      left: -20px;
      width: 150px;
      height: 150px;
      object-fit: contain;
      z-index: 3;
}

.card-purple-edit-98 {
      background: #DFDCE6;
}

.card-purple-edit-98 .card-inner {
      padding: 20px;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-98 .step-b {
      width: 180px;
      height: 180px;
      position: absolute;
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
      border: 2px solid #FFF;
}

.card-purple-edit-98 .step-b img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-purple-edit-98 .sb-1 {
      top: 15%;
      left: 15%;
      z-index: 1;
}

.card-purple-edit-98 .sb-2 {
      top: 40%;
      left: 30%;
      z-index: 2;
}

.card-purple-edit-98 .sb-3 {
      top: 65%;
      left: 45%;
      z-index: 3;
}

.card-purple-edit-98 .step-text {
      position: absolute;
      right: 20px;
      top: 10%;
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      color: #4A3B69;
      writing-mode: vertical-rl;
      letter-spacing: 8px;
}

.card-purple-edit-99 {
      background: #EBE8F0;
}

.card-purple-edit-99 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-99 .blank-bg {
      width: 85%;
      height: 85%;
      background: #FFF;
      position: absolute;
      z-index: 1;
      box-shadow: 0 10px 30px rgba(107, 76, 154, 0.1);
}

.card-purple-edit-99 .blank-cutout {
      width: 70%;
      height: 50%;
      opacity: 0.9;
      z-index: 2;
}

.card-purple-edit-99 .blank-cutout img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: sepia(0.2);
}

.card-purple-edit-99 .blank-word {
      position: absolute;
      bottom: 15%;
      z-index: 3;
      font-family: 'Inter', sans-serif;
      font-size: 4rem;
      color: #6B4C9A;
      font-weight: 900;
}

.card-purple-edit-100 {
      background: #FAF9FC;
}

.card-purple-edit-100 .card-inner {
      padding: 0;
      position: relative;
      justify-content: center;
      align-items: center;
}

.card-purple-edit-100 .mp-bg-macro {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: brightness(0.9) opacity(0.5);
      z-index: 1;
}

.card-purple-edit-100 .mp-center-frame {
      width: 65%;
      height: 55%;
      border: 3px solid rgba(255, 255, 255, 0.8);
      z-index: 2;
      padding: 10px;
      background: rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(5px);
}

.card-purple-edit-100 .mp-center-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: top;
}

.card-purple-edit-100 .mp-float-petals {
      position: absolute;
      z-index: 3;
      width: 150%;
      height: 150%;
      object-fit: cover;
      top: -25%;
      left: -25%;
      pointer-events: none;
      opacity: 0.6;
      mix-blend-mode: multiply;
}

.card-purple-edit-100 .mp-title {
      position: absolute;
      z-index: 4;
      font-family: 'Playfair Display', serif;
      font-size: 6rem;
      color: #FFF;
      top: 15%;
      font-style: italic;
      text-shadow: 0 5px 15px rgba(107, 76, 154, 0.5);
}

.card-purple-edit-100 .mp-sub {
      position: absolute;
      z-index: 4;
      bottom: 8%;
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      color: #4A3B69;
      letter-spacing: 15px;
      font-weight: 800;
}

/* 1. Clean White Editor */
.card-clean-editor .card-inner {
      padding: 30px;
}

.card-clean-editor .card-head {
      display: flex;
      align-items: center;
      gap: 15px;
      margin-bottom: 30px;
}

.card-clean-editor .avatar img {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      object-fit: cover;
}

.card-clean-editor h3 {
      font-size: 1.2rem;
      margin-bottom: 4px;
}

.card-clean-editor p {
      font-size: 0.9rem;
      color: var(--text-muted);
}

.card-clean-editor .input-mock {
      background: #f3f4f6;
      padding: 15px;
      border-radius: var(--radius-sm);
      margin-bottom: 15px;
      font-size: 0.9rem;
      color: #9ca3af;
}

.card-clean-editor .action-btn {
      width: 100%;
      padding: 15px;
      background: var(--primary);
      color: white;
      border: none;
      border-radius: var(--radius-sm);
      font-weight: 600;
      cursor: pointer;
      margin-top: 10px;
}

/* 2. Dark Mode Identity */
.card-dark-mode {
      background: #0f1115;
      color: #fff;
      border: 1px solid #272a30;
}

.card-dark-mode .card-inner {
      padding: 30px;
}

.card-dark-mode .glass-header {
      display: flex;
      gap: 20px;
      align-items: center;
      margin-bottom: 30px;
      background: rgba(255, 255, 255, 0.05);
      padding: 20px;
      border-radius: var(--radius-md);
      border: 1px solid rgba(255, 255, 255, 0.1);
}

.card-dark-mode .avatar.squared img {
      width: 70px;
      height: 70px;
      border-radius: 12px;
}

.card-dark-mode h3 {
      font-family: monospace;
      font-size: 1.4rem;
      color: #10b981;
      margin-bottom: 5px;
      letter-spacing: 0.1em;
}

.card-dark-mode p {
      font-size: 0.85rem;
      color: #9ca3af;
      text-transform: uppercase;
}

.card-dark-mode .stats-row {
      display: flex;
      gap: 30px;
      margin-bottom: 30px;
      border-bottom: 1px solid #272a30;
      padding-bottom: 20px;
}

.card-dark-mode .stat {
      font-size: 0.8rem;
      color: #6b7280;
      display: flex;
      flex-direction: column;
      gap: 5px;
}

.card-dark-mode .stat span {
      font-size: 1.5rem;
      color: #fff;
      font-weight: 700;
}

.card-dark-mode .tech-stack {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
}

.card-dark-mode .tag {
      background: #1e293b;
      color: #38bdf8;
      padding: 5px 12px;
      border-radius: 4px;
      font-size: 0.8rem;
      font-family: monospace;
}

/* 3. Minimal Light Stack */
.card-minimal-stack {
      background: #fafafa;
}

.card-minimal-stack .card-inner {
      padding: 40px;
      text-align: center;
}

.card-minimal-stack .avatar-large {
      margin: auto;
      margin-bottom: 20px;
      width: 120px;
      height: 120px;
      padding: 5px;
      background: #fff;
      border-radius: 50%;
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.card-minimal-stack .avatar-large img {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      object-fit: cover;
}

.card-minimal-stack h2 {
      font-size: 1.8rem;
      margin-bottom: 5px;
}

.card-minimal-stack .role {
      color: var(--primary);
      font-weight: 500;
      font-size: 0.9rem;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      margin-bottom: 25px;
}

.card-minimal-stack .social-links {
      display: flex;
      justify-content: center;
      gap: 15px;
      margin-bottom: 25px;
}

.card-minimal-stack .s-icon {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: #333;
}

.card-minimal-stack .bio {
      font-size: 1rem;
      color: #666;
      line-height: 1.5;
      margin-bottom: 30px;
      padding: 0 20px;
}

.card-minimal-stack .primary-btn {
      background: #111;
      color: #fff;
      padding: 12px 30px;
      border-radius: 30px;
      border: none;
      font-weight: 500;
      cursor: pointer;
}

/* 4. Retro Yellow */
.card-retro-yellow {
      background: #fbbf24;
      border: 4px solid #000;
      border-radius: 0;
      box-shadow: 10px 10px 0 #000;
}

.card-retro-yellow:hover {
      transform: translate(-5px, -5px);
      box-shadow: 15px 15px 0 #000;
}

.card-retro-yellow .retro-header {
      background: #ef4444;
      color: white;
      padding: 15px;
      text-align: center;
      border-bottom: 4px solid #000;
      font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.card-retro-yellow .retro-header h1 {
      font-size: 2.5rem;
      font-weight: 900;
      letter-spacing: -1px;
}

.card-retro-yellow .retro-header p {
      font-size: 0.8rem;
      font-weight: bold;
      letter-spacing: 2px;
}

.card-retro-yellow .retro-body {
      padding: 40px 20px;
      text-align: center;
      background: #fff;
}

.card-retro-yellow .marker-text {
      font-family: 'Caveat', cursive;
      font-size: 4rem;
      color: #000;
      transform: rotate(-5deg);
      margin-bottom: 30px;
}

.card-retro-yellow .barcode {
      font-family: monospace;
      font-size: 2rem;
      letter-spacing: -2px;
      margin-bottom: 20px;
      color: #333;
}

.card-retro-yellow .brutal-btn {
      background: #000;
      color: #fff;
      border: none;
      padding: 15px 40px;
      font-weight: 900;
      letter-spacing: 1px;
      width: 100%;
      border-radius: 0;
      cursor: pointer;
      text-transform: uppercase;
}

/* 5. Gradient Hero */
.card-gradient-hero {
      overflow: hidden;
}

.card-gradient-hero .grad-banner {
      height: 120px;
      background: linear-gradient(135deg, #f97316, #ec4899);
}

.card-gradient-hero .avatar-overlap {
      margin-top: -50px;
      text-align: center;
}

.card-gradient-hero .avatar-overlap img {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      border: 5px solid #fff;
      object-fit: cover;
}

.card-gradient-hero .content {
      padding: 20px 30px 40px;
      text-align: center;
}

.card-gradient-hero h3 {
      font-size: 1.5rem;
      margin-bottom: 5px;
}

.card-gradient-hero p {
      color: #666;
      margin-bottom: 25px;
}

.card-gradient-hero .link-list {
      display: flex;
      flex-direction: column;
      gap: 10px;
}

.card-gradient-hero .link-item {
      padding: 15px;
      border-radius: var(--radius-md);
      background: #f8f9fa;
      border: 1px solid #eee;
      font-weight: 500;
      cursor: pointer;
      transition: background 0.2s;
}

.card-gradient-hero .link-item:hover {
      background: #f0f4fd;
      color: var(--primary);
      border-color: var(--primary);
}

/* 6. Editorial Serif */
.card-editorial {
      background: #f5f2eb;
}

.card-editorial .card-inner {
      padding: 40px;
}

.card-editorial .serif-header {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      font-style: italic;
      text-align: center;
      color: #333;
      margin-bottom: 20px;
}

.card-editorial hr {
      border: none;
      border-top: 1px solid #dcd5c6;
      margin-bottom: 30px;
}

.card-editorial .story-content {
      position: relative;
      margin-bottom: 40px;
}

.card-editorial .dropcap {
      float: left;
      font-family: 'Playfair Display', serif;
      font-size: 4.5rem;
      line-height: 0.8;
      margin-right: 15px;
      color: #111;
}

.card-editorial .text {
      font-family: 'Playfair Display', serif;
      font-size: 1.1rem;
      line-height: 1.7;
      color: #555;
}

.card-editorial .author-stamp {
      display: flex;
      align-items: center;
      gap: 15px;
      border-top: 1px dashed #ccc;
      padding-top: 20px;
}

.card-editorial .author-stamp img {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      filter: grayscale(100%);
}

.card-editorial .author-stamp span {
      font-family: 'Inter', sans-serif;
      font-size: 0.9rem;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #777;
}

/* 7. Music Player Card */
.card-music-player {
      background: #18181b;
      color: #fff;
}

.card-music-player .card-inner {
      padding: 30px;
}

.card-music-player .now-playing {
      font-size: 0.8rem;
      text-transform: uppercase;
      letter-spacing: 0.2em;
      color: #a1a1aa;
      text-align: center;
      margin-bottom: 25px;
}

.card-music-player .album-art {
      border-radius: 12px;
      overflow: hidden;
      margin-bottom: 25px;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
      aspect-ratio: 1/1;
}

.card-music-player .album-art img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.card-music-player .track-info {
      text-align: center;
      margin-bottom: 25px;
}

.card-music-player h3 {
      font-size: 1.4rem;
      margin-bottom: 5px;
}

.card-music-player p {
      color: #a1a1aa;
}

.card-music-player .progress-bar {
      height: 4px;
      background: #3f3f46;
      border-radius: 2px;
      margin-bottom: 25px;
}

.card-music-player .fill {
      width: 45%;
      height: 100%;
      background: #fff;
      border-radius: 2px;
      position: relative;
}

.card-music-player .fill::after {
      content: '';
      position: absolute;
      right: -4px;
      top: -3px;
      width: 10px;
      height: 10px;
      background: #fff;
      border-radius: 50%;
}

.card-music-player .controls {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 30px;
      font-size: 1.5rem;
      color: #d4d4d8;
}

.card-music-player .play {
      font-size: 2.5rem;
      color: #fff;
}

/* Share and Download Overlays */
.card-actions {
      position: absolute;
      bottom: 15px;
      left: 50%;
      transform: translateX(-50%) translateY(10px);
      display: flex;
      gap: 10px;
      opacity: 0;
      transition: opacity 0.3s ease, transform 0.3s ease;
      z-index: 100;
      pointer-events: none;
      /* Let hover pass through to the card mostly */
}

.profile-card:hover .card-actions {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
      pointer-events: auto;
      /* Enable clicks when visible */
}

.action-btn {
      background: rgba(0, 0, 0, 0.65);
      color: #fff;
      border: 1px solid rgba(255, 255, 255, 0.2);
      padding: 8px 14px;
      border-radius: 20px;
      font-size: 0.75rem;
      font-family: 'Inter', sans-serif;
      font-weight: 500;
      cursor: pointer;
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      display: flex;
      align-items: center;
      gap: 6px;
      transition: background 0.2s, transform 0.2s;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.action-btn:hover {
      background: rgba(0, 0, 0, 0.85);
      transform: translateY(-2px);
}

.action-btn svg {
      opacity: 0.9;
}

/* Green Golden Era Posters */
.card-green-era {
      background: #eef2eb;
      /* Default pastel sage */
      color: #1a2f1b;
      /* Deep green text */
      padding: 0;
      font-family: 'Playfair Display', serif;
}

.card-green-era .card-inner {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
      box-shadow: inset 0 0 100px rgba(20, 50, 20, 0.05);
      /* Vignette */
}

/* Vintage Film Grain */
.card-green-era .film-grain {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0.15;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');
      mix-blend-mode: multiply;
      pointer-events: none;
      z-index: 20;
}

/* Base Image Styling */
.card-green-era .subject-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: relative;
      z-index: 5;
      filter: sepia(10%) contrast(1.05) brightness(0.95);
      /* Matte film look */
}

.card-green-era .floral-img {
      position: absolute;
      object-fit: contain;
      z-index: 8;
      filter: sepia(5%) brightness(0.9);
      pointer-events: none;
}

/* 1. Center Portrait + Tall Typography Behind */
.cge-01 .bg-tall-text {
      position: absolute;
      top: 5%;
      left: 0;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-weight: 300;
      font-size: 8rem;
      letter-spacing: -2px;
      color: #cbd5c1;
      z-index: 1;
      line-height: 0.8;
}

.cge-01 .subject-img {
      height: 80%;
      width: 80%;
      margin: auto;
      border-radius: 4px;
      box-shadow: 0 15px 35px rgba(10, 30, 10, 0.15);
}

.cge-01 .bottom-title {
      text-align: center;
      padding: 20px;
      z-index: 10;
}

.cge-01 .bottom-title h2 {
      font-size: 2rem;
      margin-bottom: 5px;
      color: #1a3320;
}

.cge-01 .bottom-title p {
      font-size: 0.8rem;
      font-family: 'Inter', sans-serif;
      text-transform: uppercase;
      letter-spacing: 2px;
}

/* 2. Side-aligned Portrait + Cropped Text */
.cge-02 {
      background: #dce3d6;
}

.cge-02 .subject-img {
      position: absolute;
      right: -10%;
      bottom: 0;
      width: 85%;
      height: 90%;
}

.cge-02 .cropped-text {
      position: absolute;
      left: 20px;
      top: 20%;
      font-size: 6rem;
      line-height: 0.85;
      font-weight: 700;
      color: #2c4c3b;
      z-index: 10;
      width: 50%;
      word-break: break-all;
}

/* 3. Extreme Close-up Crop */
.cge-03 .subject-img {
      transform: scale(1.3);
      transform-origin: top center;
}

.cge-03 .overlay-box {
      position: absolute;
      bottom: 30px;
      left: 30px;
      background: rgba(238, 242, 235, 0.9);
      backdrop-filter: blur(5px);
      padding: 15px 20px;
      z-index: 10;
      border: 1px solid rgba(44, 76, 59, 0.2);
}

.cge-03 h3 {
      font-size: 1.5rem;
      letter-spacing: 2px;
}

/* 4. Upper-half Portrait */
.cge-04 .subject-img {
      height: 65%;
      margin-bottom: auto;
      border-bottom: 2px solid #2c4c3b;
}

.cge-04 .text-area {
      height: 35%;
      padding: 25px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      background: #f4f7f1;
}

.cge-04 h2 {
      font-size: 2.8rem;
      line-height: 1;
      margin-bottom: 10px;
}

/* 5. Lower-half Portrait */
.cge-05 .subject-img {
      height: 60%;
      margin-top: auto;
      border-top: 4px solid #1a3320;
}

.cge-05 .text-area {
      position: absolute;
      top: 0;
      width: 100%;
      height: 40%;
      padding: 30px;
      text-align: right;
      background: #eef2eb;
}

.cge-05 h1 {
      font-family: 'Inter', sans-serif;
      font-weight: 200;
      font-size: 4rem;
      color: #3d5e4a;
}

/* 6. Full Bleed Background */
.cge-06 {
      background: #2c4c3b;
      color: #eef2eb;
}

.cge-06 .subject-img {
      z-index: 1;
      opacity: 0.85;
}

.cge-06 .center-text {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 10;
      text-align: center;
      width: 90%;
      text-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}

.cge-06 h2 {
      font-size: 3.5rem;
      font-style: italic;
}

/* 7. Vertical Margin Typography */
.cge-07 .side-text {
      position: absolute;
      left: 15px;
      bottom: 20px;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      letter-spacing: 6px;
      z-index: 10;
      color: #2c4c3b;
}

.cge-07 .subject-img {
      width: 85%;
      margin-left: auto;
      box-shadow: -10px 0 30px rgba(0, 0, 0, 0.05);
}

/* 8. Split Text Front/Behind */
.cge-08 .bg-text {
      position: absolute;
      font-size: 7rem;
      color: #dce3d6;
      top: 20%;
      left: -10%;
      z-index: 1;
}

.cge-08 .fg-text {
      position: absolute;
      font-size: 7rem;
      color: #eef2eb;
      -webkit-text-stroke: 1px #2c4c3b;
      top: 20%;
      left: -10%;
      z-index: 10;
      pointer-events: none;
}

/* 9. Cropped Oversized Letters */
.cge-09 {
      overflow: hidden;
}

.cge-09 .huge-char {
      position: absolute;
      font-family: 'Inter', sans-serif;
      font-size: 25rem;
      font-weight: 900;
      line-height: 0.7;
      color: #e6edd9;
      top: -5%;
      right: -15%;
      z-index: 1;
}

.cge-09 .subject-img {
      width: 75%;
      margin-top: auto;
      margin-left: 20px;
      border-radius: 4px;
}

/* 10. Minimal Typography */
.cge-10 .subject-img {
      width: 60%;
      height: 75%;
      margin: auto;
}

.cge-10 .minimal-text {
      position: absolute;
      bottom: 40px;
      width: 100%;
      text-align: center;
      font-size: 0.85rem;
      letter-spacing: 3px;
      z-index: 10;
}

/* 11. Serif Dominant */
.cge-11 .top-headline {
      padding: 30px 20px;
      text-align: center;
      z-index: 10;
}

.cge-11 h1 {
      font-family: 'Playfair Display', serif;
      font-size: 4.5rem;
      color: #1a3320;
      border-bottom: 1px solid #1a3320;
      padding-bottom: 10px;
}

/* 12. Ultra Bold Condensed */
.cge-12 .bold-banner {
      background: #1a3320;
      color: #eef2eb;
      padding: 15px;
      font-family: 'Inter', sans-serif;
      font-weight: 800;
      font-size: 3.5rem;
      text-transform: uppercase;
      line-height: 0.9;
      letter-spacing: -1px;
      z-index: 10;
}

/* 13. Mixed Serif & Sans */
.cge-13 .mix-title {
      position: absolute;
      top: 40px;
      left: 30px;
      z-index: 10;
}

.cge-13 h2 {
      font-family: 'Playfair Display', serif;
      font-size: 3rem;
      margin-bottom: -10px;
}

.cge-13 span {
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      letter-spacing: 4px;
      font-weight: 500;
}

/* 14. Stacked Vertical Layout */
.cge-14 .stack {
      position: absolute;
      right: 20px;
      top: 50px;
      display: flex;
      flex-direction: column;
      z-index: 10;
      text-align: right;
}

.cge-14 .stack span {
      font-size: 4rem;
      line-height: 0.8;
      font-weight: 700;
      color: #eef2eb;
      text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
}

/* 15. Diagonal Text */
.cge-15 .diag-text {
      position: absolute;
      top: 40%;
      left: -10%;
      transform: rotate(-15deg);
      font-size: 5rem;
      white-space: nowrap;
      color: #c4d1b4;
      z-index: 1;
      opacity: 0.7;
}

/* 16. Circular Mask */
.cge-16 .circle-mask {
      width: 250px;
      height: 250px;
      border-radius: 50%;
      overflow: hidden;
      margin: 80px auto 40px;
      border: 2px solid #2c4c3b;
      position: relative;
      z-index: 5;
}

.cge-16 h2 {
      text-align: center;
      font-size: 2.5rem;
      color: #1a3320;
}

/* 17. Framed Border */
.cge-17 .card-inner {
      border: 15px solid #dce3d6;
      padding: 15px;
      background: #fff;
}

.cge-17 .subject-img {
      border: 1px solid #c4d1b4;
}

/* 18. Large Negative Space Top */
.cge-18 .subject-img {
      height: 50%;
      margin-top: auto;
      object-position: top;
}

.cge-18 .top-space {
      height: 50%;
      padding: 40px 20px;
      z-index: 10;
}

/* 19. Large Negative Space Bottom */
.cge-19 .subject-img {
      height: 55%;
      margin-bottom: auto;
}

.cge-19 .bottom-space {
      position: absolute;
      bottom: 0;
      padding: 40px 20px;
      width: 100%;
      text-align: center;
      z-index: 10;
}

/* 20. Floral Heavy Border */
.cge-20 .floral-top {
      top: -20px;
      left: -20px;
      width: 200px;
      transform: rotate(15deg);
}

.cge-20 .floral-bottom {
      bottom: -20px;
      right: -20px;
      width: 200px;
      transform: rotate(195deg);
}

/* 21. Minimal Floral */
.cge-21 .floral-tiny {
      bottom: 40px;
      right: 40px;
      width: 80px;
}

.cge-21 .subject-img {
      width: 80%;
      height: 80%;
      margin: 20px;
}

/* 22. Dense Botanical Background */
.cge-22 {
      background-image: url('assets/img/a39a2d5ca5155b81f66f81dde89e0602.jpg');
      background-size: cover;
}

.cge-22 .overlay {
      background: rgba(238, 242, 235, 0.85);
      position: absolute;
      inset: 0;
      z-index: 1;
      backdrop-filter: blur(2px);
}

.cge-22 .subject-img {
      width: 70%;
      height: 85%;
      margin: auto;
      z-index: 5;
}

/* 23. Soft Gradient */
.cge-23 {
      background: linear-gradient(145deg, #eef2eb 0%, #c4d1b4 100%);
}

.cge-23 .subject-img {
      mix-blend-mode: multiply;
      filter: grayscale(20%) sepia(20%);
}

/* 24. Dark Emerald */
.cge-24 {
      background: #132418;
      color: #eef2eb;
}

.cge-24 .subject-img {
      opacity: 0.9;
}

.cge-24 h2 {
      color: #dce3d6;
      border-color: #dce3d6;
}

/* 25. Light Mint */
.cge-25 {
      background: #f0f7f2;
}

.cge-25 .subject-img {
      filter: sepia(5%) brightness(1.05);
}

/* 26. Olive Toned */
.cge-26 {
      background: #dcd7c6;
}

.cge-26 .subject-img {
      filter: sepia(30%) hue-rotate(20deg);
}

/* 27. Jade Toned */
.cge-27 {
      background: #e0ece6;
      color: #163628;
}

/* 28. Desaturated Vintage */
.cge-28 .subject-img {
      filter: grayscale(40%) sepia(30%) contrast(0.9);
}

.cge-28 {
      background: #e8e6e1;
}

/* 29. Strong Contrast Emerald */
.cge-29 .subject-img {
      filter: contrast(1.2) saturate(1.1);
}

.cge-29 {
      background: #0f1c13;
      color: #fff;
}

/* 30. Headline Overlapping Shoulder */
.cge-30 .subject-img {
      position: relative;
      z-index: 5;
}

.cge-30 .shoulder-text {
      position: absolute;
      bottom: 30%;
      right: 10%;
      z-index: 10;
      font-size: 3rem;
      text-align: right;
      text-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
      color: #fff;
}

/* 31. Headline Behind Hair */
.cge-31 .bg-headline {
      position: absolute;
      top: 15%;
      width: 100%;
      text-align: center;
      font-size: 5.5rem;
      color: #cbd5c1;
      z-index: 1;
      letter-spacing: -2px;
}

/* 32. Drop Shadow Vintage */
.cge-32 h1 {
      text-shadow: 3px 3px 0 #c4d1b4, 6px 6px 0 rgba(44, 76, 59, 0.2);
      font-size: 4rem;
      text-align: center;
      margin-top: 40px;
}

/* 33. Embossed Effect */
.cge-33 h2 {
      color: #eef2eb;
      text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.8), 2px 2px 3px rgba(0, 0, 0, 0.2);
      font-size: 3.5rem;
      text-align: center;
      top: 15%;
      width: 100%;
      position: absolute;
      z-index: 10;
}

/* 34. Single Letter Dominant */
.cge-34 .giant-letter {
      font-size: 20rem;
      color: #2c4c3b;
      position: absolute;
      top: -50px;
      left: 20px;
      z-index: 1;
      opacity: 0.15;
      line-height: 1;
}

/* 35. Thin Elegant Typographic */
.cge-35 {
      background: #f7f9f5;
}

.cge-35 h3 {
      font-family: 'Inter', sans-serif;
      font-weight: 300;
      font-size: 2rem;
      letter-spacing: 12px;
      text-transform: uppercase;
      text-align: center;
      padding: 40px 0;
}

/* 36. Bold Block Masthead */
.cge-36 .masthead {
      background: #2c4c3b;
      color: #fff;
      padding: 20px;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-weight: 900;
      font-size: 2.5rem;
      letter-spacing: 5px;
}

/* 37. Magazine Cover Subheadlines */
.cge-37 .subhead-left {
      position: absolute;
      left: 20px;
      top: 40%;
      width: 80px;
      font-size: 0.75rem;
      z-index: 10;
      color: #eef2eb;
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}

.cge-37 .subhead-right {
      position: absolute;
      right: 20px;
      top: 60%;
      width: 90px;
      font-size: 0.75rem;
      text-align: right;
      z-index: 10;
      color: #eef2eb;
      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}

.cge-37 .subject-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
}

/* 38. Minimalist Almost Blank */
.cge-38 .subject-img {
      width: 40%;
      height: 50%;
      margin: auto;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.cge-38 p {
      text-align: center;
      font-size: 0.8rem;
      margin-top: 20px;
      letter-spacing: 2px;
}

/* 39. Floral Arch */
.cge-39 .floral-arch {
      position: absolute;
      top: 0;
      width: 100%;
      height: 40%;
      object-fit: contain;
      z-index: 10;
      transform: scale(1.1);
}

/* 40. Botanical Corners */
.cge-40 .corner-1 {
      top: 10px;
      left: 10px;
      width: 100px;
}

.cge-40 .corner-2 {
      bottom: 10px;
      right: 10px;
      width: 100px;
      transform: rotate(180deg);
}

/* 41. Full Floral Side Cluster */
.cge-41 .side-floral {
      position: absolute;
      right: -30px;
      top: 20%;
      height: 70%;
      object-fit: contain;
      z-index: 8;
      opacity: 0.9;
}

/* 42. Small Subtle Accents */
.cge-42 .tiny-bloom {
      position: absolute;
      width: 40px;
      z-index: 10;
}

.cge-42 .tb-1 {
      top: 20%;
      left: 15%;
}

.cge-42 .tb-2 {
      bottom: 30%;
      right: 20%;
}

/* 43. Floral Behind Text */
.cge-43 .floral-bg {
      position: absolute;
      top: 25%;
      left: 10%;
      width: 80%;
      z-index: 9;
      opacity: 0.6;
}

.cge-43 h1 {
      position: absolute;
      top: 35%;
      width: 100%;
      text-align: center;
      z-index: 10;
      font-size: 4rem;
      color: #1a3320;
}

/* 44. Text Inside Floral Frame */
.cge-44 .frame-img {
      position: absolute;
      top: 10%;
      left: 0;
      width: 100%;
      z-index: 2;
      opacity: 0.3;
}

.cge-44 .center-txt {
      position: absolute;
      top: 40%;
      width: 100%;
      text-align: center;
      z-index: 10;
}

/* 45. Asymmetrical Right-Heavy */
.cge-45 .subject-img {
      width: 70%;
      margin-left: auto;
      height: 100%;
}

.cge-45 h2 {
      position: absolute;
      left: 20px;
      bottom: 50px;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      font-size: 3rem;
      color: #2c4c3b;
}

/* 46. Asymmetrical Left-Heavy */
.cge-46 .subject-img {
      width: 75%;
      height: 85%;
      margin-top: auto;
      border-top-right-radius: 80px;
}

.cge-46 h2 {
      position: absolute;
      right: 20px;
      top: 40px;
      font-size: 2.5rem;
      text-align: right;
}

/* 47. Perfect Symmetrical */
.cge-47 .subject-img {
      width: 80%;
      height: 70%;
      margin: auto;
      object-position: center;
      border-radius: 200px 200px 0 0;
}

.cge-47 .sym-text {
      text-align: center;
      position: absolute;
      bottom: 30px;
      width: 100%;
}

/* 48. Soft Faded Typo */
.cge-48 .faded-txt {
      font-size: 6rem;
      color: #cbd5c1;
      opacity: 0.4;
      text-align: center;
      line-height: 0.8;
      margin-top: 30px;
}

/* 49. Strong Opaque Typo */
.cge-49 .opaque-box {
      background: #1a3320;
      padding: 20px;
      width: 80%;
      margin: -40px auto 0;
      position: relative;
      z-index: 10;
      color: #eef2eb;
      text-align: center;
}

.cge-49 .subject-img {
      height: 75%;
}

/* 50. Layered Experimental */
.cge-50 .layer-1 {
      font-size: 8rem;
      color: #dce3d6;
      position: absolute;
      top: 10%;
      left: -10%;
      z-index: 1;
}

.cge-50 .subject-img {
      width: 80%;
      margin: auto;
      position: relative;
      z-index: 5;
      mix-blend-mode: darken;
}

.cge-50 .layer-2 {
      font-family: 'Inter', sans-serif;
      font-weight: 700;
      font-size: 2rem;
      color: #1a3320;
      position: absolute;
      bottom: 20%;
      right: 10%;
      z-index: 10;
      transform: rotate(-5deg);
}

\n

/* =========================================================
   BLACK & GOLD LUXURY COLLECTION
   ========================================================= */
.card-bg-luxury {
      background: #0f0f0f;
      color: #d4af37;
      padding: 0;
      font-family: 'Playfair Display', serif;
}

.card-bg-luxury .card-inner {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
      box-shadow: inset 0 0 120px rgba(0, 0, 0, 0.8);
}

.card-bg-luxury .bg-grain {
      position: absolute;
      inset: 0;
      opacity: 0.15;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.95" numOctaves="4" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise)"/%3E%3C/svg%3E');
      mix-blend-mode: screen;
      z-index: 20;
      pointer-events: none;
}

.card-bg-luxury .subject-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 5;
      filter: contrast(1.15) brightness(0.85) saturate(0.8);
}

.card-bg-luxury .gold-text {
      background: linear-gradient(135deg, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      z-index: 10;
      position: relative;
}

.card-bg-luxury .gold-line {
      background: linear-gradient(90deg, #bf953f, #fcf6ba, #b38728);
      position: absolute;
      z-index: 10;
}

.cbgl-01 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-01 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-01 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-01 {
      background: #0111;
}

.cbgl-02 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-02 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-02 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-02 {
      background: #0222;
}

.cbgl-03 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-03 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-03 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-03 {
      background: #0333;
}

.cbgl-04 .subject-img {
      height: 60%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-04 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-04 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-04 {
      background: #0444;
}

.cbgl-05 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-05 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-05 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-05 {
      background: #0555;
}

.cbgl-06 .subject-img {
      height: 89.99999999999999%;
      width: 80%;


      border: none;
      box-shadow: none;
}

.cbgl-06 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-06 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-06 {
      background: #0666;
}

.cbgl-07 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-07 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-07 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-07 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-08 .subject-img {
      height: 60%;
      width: 100%;


      border: 2px solid #b38728;
      box-shadow: none;
}

.cbgl-08 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-08 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-08 {
      background: #0888;
}

.cbgl-09 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: 0 10px 40px rgba(179, 135, 40, 0.2);
}

.cbgl-09 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-09 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-09 {
      background: #0000;
}

.cbgl-10 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-10 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 10px;
      left: auto;
      top: 10%;
      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-10 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-10 {
      background: #0111;
}

.cbgl-11 .subject-img {
      height: 104.99999999999999%;
      width: 100%;
      border-radius: 50%;
      width: 80%;
      height: 60%;
      object-fit: cover;

      border: none;
      box-shadow: none;
}

.cbgl-11 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-11 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-11 {
      background: #0222;
}

.cbgl-12 .subject-img {
      height: 60%;
      width: 80%;


      border: none;
      box-shadow: none;
}

.cbgl-12 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Inter', sans-serif;

      text-shadow: none;
      -webkit-text-stroke: 1px #d4af37;
      color: transparent !important;
      background: none;
      z-index: 10;
}

.cbgl-12 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-12 {
      background: #0333;
}

.cbgl-13 .subject-img {
      height: 75%;
      width: 100%;

      clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
      border: none;
      box-shadow: none;
}

.cbgl-13 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-13 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-13 {
      background: #0444;
}

.cbgl-14 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-14 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-14 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-14 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-15 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-15 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-15 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-15 {
      background: #0666;
}

.cbgl-16 .subject-img {
      height: 60%;
      width: 100%;


      border: 2px solid #b38728;
      box-shadow: none;
}

.cbgl-16 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-16 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-16 {
      background: #0777;
}

.cbgl-17 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-17 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-17 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-17 {
      background: #0888;
}

.cbgl-18 .subject-img {
      height: 89.99999999999999%;
      width: 80%;


      border: none;
      box-shadow: 0 10px 40px rgba(179, 135, 40, 0.2);
}

.cbgl-18 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-18 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-18 {
      background: #0000;
}

.cbgl-19 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-19 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-19 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-19 {
      background: #0111;
}

.cbgl-20 .subject-img {
      height: 60%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-20 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 10px;
      left: auto;
      top: 10%;
      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-20 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-20 {
      background: #0222;
}

.cbgl-21 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-21 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-21 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-21 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-22 .subject-img {
      height: 89.99999999999999%;
      width: 100%;
      border-radius: 50%;
      width: 80%;
      height: 60%;
      object-fit: cover;

      border: none;
      box-shadow: none;
}

.cbgl-22 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-22 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-22 {
      background: #0444;
}

.cbgl-23 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-23 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-23 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-23 {
      background: #0555;
}

.cbgl-24 .subject-img {
      height: 60%;
      width: 80%;


      border: 2px solid #b38728;
      box-shadow: none;
}

.cbgl-24 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Inter', sans-serif;

      text-shadow: none;
      -webkit-text-stroke: 1px #d4af37;
      color: transparent !important;
      background: none;
      z-index: 10;
}

.cbgl-24 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-24 {
      background: #0666;
}

.cbgl-25 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-25 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-25 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-25 {
      background: #0777;
}

.cbgl-26 .subject-img {
      height: 89.99999999999999%;
      width: 100%;

      clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
      border: none;
      box-shadow: none;
}

.cbgl-26 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-26 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-26 {
      background: #0888;
}

.cbgl-27 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: 0 10px 40px rgba(179, 135, 40, 0.2);
}

.cbgl-27 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-27 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-27 {
      background: #0000;
}

.cbgl-28 .subject-img {
      height: 60%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-28 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-28 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-28 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-29 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-29 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-29 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-29 {
      background: #0222;
}

.cbgl-30 .subject-img {
      height: 89.99999999999999%;
      width: 80%;


      border: none;
      box-shadow: none;
}

.cbgl-30 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 10px;
      left: auto;
      top: 10%;
      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-30 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-30 {
      background: #0333;
}

.cbgl-31 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-31 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-31 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-31 {
      background: #0444;
}

.cbgl-32 .subject-img {
      height: 60%;
      width: 100%;


      border: 2px solid #b38728;
      box-shadow: none;
}

.cbgl-32 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-32 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-32 {
      background: #0555;
}

.cbgl-33 .subject-img {
      height: 75%;
      width: 100%;
      border-radius: 50%;
      width: 80%;
      height: 60%;
      object-fit: cover;

      border: none;
      box-shadow: none;
}

.cbgl-33 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-33 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-33 {
      background: #0666;
}

.cbgl-34 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-34 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-34 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-34 {
      background: #0777;
}

.cbgl-35 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-35 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-35 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-35 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-36 .subject-img {
      height: 60%;
      width: 80%;


      border: none;
      box-shadow: 0 10px 40px rgba(179, 135, 40, 0.2);
}

.cbgl-36 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Inter', sans-serif;

      text-shadow: none;
      -webkit-text-stroke: 1px #d4af37;
      color: transparent !important;
      background: none;
      z-index: 10;
}

.cbgl-36 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-36 {
      background: #0000;
}

.cbgl-37 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-37 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-37 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-37 {
      background: #0111;
}

.cbgl-38 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-38 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-38 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-38 {
      background: #0222;
}

.cbgl-39 .subject-img {
      height: 104.99999999999999%;
      width: 100%;

      clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
      border: none;
      box-shadow: none;
}

.cbgl-39 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-39 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-39 {
      background: #0333;
}

.cbgl-40 .subject-img {
      height: 60%;
      width: 100%;


      border: 2px solid #b38728;
      box-shadow: none;
}

.cbgl-40 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 10px;
      left: auto;
      top: 10%;
      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-40 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-40 {
      background: #0444;
}

.cbgl-41 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-41 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-41 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-41 {
      background: #0555;
}

.cbgl-42 .subject-img {
      height: 89.99999999999999%;
      width: 80%;


      border: none;
      box-shadow: none;
}

.cbgl-42 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-42 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-42 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-43 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-43 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-43 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-43 {
      background: #0777;
}

.cbgl-44 .subject-img {
      height: 60%;
      width: 100%;
      border-radius: 50%;
      width: 80%;
      height: 60%;
      object-fit: cover;

      border: none;
      box-shadow: none;
}

.cbgl-44 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Inter', sans-serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-44 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-44 {
      background: #0888;
}

.cbgl-45 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: 0 10px 40px rgba(179, 135, 40, 0.2);
}

.cbgl-45 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 200;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-45 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-45 {
      background: #0000;
}

.cbgl-46 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-46 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-46 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-46 {
      background: #0111;
}

.cbgl-47 .subject-img {
      height: 104.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-47 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 5rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-47 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-47 {
      background: #0222;
}

.cbgl-48 .subject-img {
      height: 60%;
      width: 80%;


      border: 2px solid #b38728;
      box-shadow: none;
}

.cbgl-48 .hero-text {
      position: absolute;
      top: 5%;
      left: 5%;
      font-size: 6.5rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 200;
      font-family: 'Inter', sans-serif;

      text-shadow: none;
      -webkit-text-stroke: 1px #d4af37;
      color: transparent !important;
      background: none;
      z-index: 10;
}

.cbgl-48 .sub-text {
      position: absolute;
      bottom: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-48 {
      background: #0333;
}

.cbgl-49 .subject-img {
      height: 75%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-49 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 8rem;
      line-height: 0.9;
      letter-spacing: 4px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;

      text-shadow: none;

      z-index: 10;
}

.cbgl-49 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-49 {
      background: linear-gradient(135deg, #2b2210, #0a0804);
}

.cbgl-50 .subject-img {
      height: 89.99999999999999%;
      width: 100%;


      border: none;
      box-shadow: none;
}

.cbgl-50 .hero-text {
      position: absolute;
      bottom: 5%;
      right: 5%;
      font-size: 2rem;
      line-height: 0.9;
      letter-spacing: -2px;
      font-weight: 900;
      font-family: 'Playfair Display', serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 10px;
      left: auto;
      top: 10%;
      text-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);

      z-index: 10;
}

.cbgl-50 .sub-text {
      position: absolute;
      top: 20px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.7rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #a89f91;
      text-transform: uppercase;
}

.cbgl-50 {
      background: #0555;
}

\n

/* =========================================================
   ROYAL MAROON HERITAGE COLLECTION
   ========================================================= */
.card-royal {
      background: #4a0404;
      /* Deep maroon base */
      color: #d4af37;
      /* Antique gold */
      padding: 0;
      font-family: 'Playfair Display', serif;
}

.card-royal .card-inner {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
      box-shadow: inset 0 0 150px rgba(20, 0, 0, 0.9);
      /* Subtle palace vignette */
}

/* Velvet texture overlay */
.card-royal .velvet-texture {
      position: absolute;
      inset: 0;
      opacity: 0.4;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.6" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise)"/%3E%3C/svg%3E');
      mix-blend-mode: overlay;
      z-index: 20;
      pointer-events: none;
}

.card-royal .brocade-pattern {
      position: absolute;
      inset: 0;
      opacity: 0.15;
      background-image: radial-gradient(#d4af37 1px, transparent 1px), radial-gradient(#d4af37 1px, transparent 1px);
      background-size: 20px 20px;
      background-position: 0 0, 10px 10px;
      z-index: 15;
      pointer-events: none;
}

.card-royal .subject-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 5;
      filter: sepia(30%) contrast(1.1) brightness(0.85);
      /* Palace lighting */
}

.card-royal .royal-gold {
      background: linear-gradient(135deg, #c5a059 0%, #e2c77a 20%, #8b6d33 50%, #e2c77a 80%, #c5a059 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      z-index: 10;
      position: relative;
      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.card-royal .royal-border {
      position: absolute;
      inset: 15px;
      border: 2px solid #d4af37;
      z-index: 10;
      pointer-events: none;
      opacity: 0.8;
}

.card-royal .arch-frame {
      position: absolute;
      top: 10%;
      bottom: 0;
      left: 10%;
      right: 10%;
      border: 3px solid #d4af37;
      border-top-left-radius: 150px;
      border-top-right-radius: 150px;
      z-index: 10;
      pointer-events: none;
}

.croyal-01 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-01 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-01 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-01 {
      background: #3b0918;
}

.croyal-02 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-02 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-02 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-02 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-03 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-03 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-03 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-03 {
      background: #2e050c;
}

.croyal-04 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-04 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-04 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-04 {
      background: #4a0404;
}

.croyal-05 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-05 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-05 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-05 {
      background: #3b0918;
}

.croyal-06 .subject-img {
      height: 65%;
      width: 80%;



      /* extra vintage */
}

.croyal-06 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-06 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-06 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-07 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-07 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-07 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-07 {
      background: #2e050c;
}

.croyal-08 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      filter: sepia(40%) contrast(1.15) brightness(0.8) hue-rotate(-10deg);
      /* extra vintage */
}

.croyal-08 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-08 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-08 {
      background: #4a0404;
}

.croyal-09 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-09 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-09 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-09 {
      background: #3b0918;
}

.croyal-10 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-10 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 20px;
      left: auto;
      top: 15%;
      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-10 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-10 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-11 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-11 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-11 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-11 {
      background: #2e050c;
}

.croyal-12 .subject-img {
      height: 80%;
      width: 80%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-12 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-12 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-12 {
      background: #4a0404;
}

.croyal-13 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-13 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-13 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-13 {
      background: #3b0918;
}

.croyal-14 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-14 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      right: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-14 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-14 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-15 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-15 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-15 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-15 {
      background: #2e050c;
}

.croyal-16 .subject-img {
      height: 65%;
      width: 100%;



      filter: sepia(40%) contrast(1.15) brightness(0.8) hue-rotate(-10deg);
      /* extra vintage */
}

.croyal-16 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-16 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-16 {
      background: #4a0404;
}

.croyal-17 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-17 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-17 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-17 {
      background: #3b0918;
}

.croyal-18 .subject-img {
      height: 95%;
      width: 80%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-18 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-18 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-18 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-19 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-19 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-19 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-19 {
      background: #2e050c;
}

.croyal-20 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-20 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 20px;
      left: auto;
      top: 15%;
      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-20 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-20 {
      background: #4a0404;
}

.croyal-21 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-21 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-21 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-21 {
      background: #3b0918;
}

.croyal-22 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-22 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-22 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-22 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-23 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-23 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-23 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-23 {
      background: #2e050c;
}

.croyal-24 .subject-img {
      height: 110.00000000000001%;
      width: 80%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      filter: sepia(40%) contrast(1.15) brightness(0.8) hue-rotate(-10deg);
      /* extra vintage */
}

.croyal-24 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-24 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-24 {
      background: #4a0404;
}

.croyal-25 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-25 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-25 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-25 {
      background: #3b0918;
}

.croyal-26 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-26 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-26 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-26 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-27 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-27 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-27 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-27 {
      background: #2e050c;
}

.croyal-28 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-28 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-28 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-28 {
      background: #4a0404;
}

.croyal-29 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-29 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      right: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-29 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-29 {
      background: #3b0918;
}

.croyal-30 .subject-img {
      height: 50%;
      width: 80%;



      /* extra vintage */
}

.croyal-30 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 20px;
      left: auto;
      top: 15%;
      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-30 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-30 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-31 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-31 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-31 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-31 {
      background: #2e050c;
}

.croyal-32 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      filter: sepia(40%) contrast(1.15) brightness(0.8) hue-rotate(-10deg);
      /* extra vintage */
}

.croyal-32 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-32 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-32 {
      background: #4a0404;
}

.croyal-33 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-33 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-33 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-33 {
      background: #3b0918;
}

.croyal-34 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-34 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-34 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-34 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-35 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-35 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-35 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-35 {
      background: #2e050c;
}

.croyal-36 .subject-img {
      height: 65%;
      width: 80%;



      /* extra vintage */
}

.croyal-36 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-36 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-36 {
      background: #4a0404;
}

.croyal-37 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-37 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-37 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-37 {
      background: #3b0918;
}

.croyal-38 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-38 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-38 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-38 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-39 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-39 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-39 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-39 {
      background: #2e050c;
}

.croyal-40 .subject-img {
      height: 50%;
      width: 100%;



      filter: sepia(40%) contrast(1.15) brightness(0.8) hue-rotate(-10deg);
      /* extra vintage */
}

.croyal-40 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 20px;
      left: auto;
      top: 15%;
      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-40 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-40 {
      background: #4a0404;
}

.croyal-41 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-41 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-41 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-41 {
      background: #3b0918;
}

.croyal-42 .subject-img {
      height: 80%;
      width: 80%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-42 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-42 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-42 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-43 .subject-img {
      height: 95%;
      width: 100%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      /* extra vintage */
}

.croyal-43 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-43 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-43 {
      background: #2e050c;
}

.croyal-44 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-44 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      right: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-44 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-44 {
      background: #4a0404;
}

.croyal-45 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-45 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-45 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-45 {
      background: #3b0918;
}

.croyal-46 .subject-img {
      height: 65%;
      width: 100%;



      /* extra vintage */
}

.croyal-46 .hero-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-46 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-46 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

.croyal-47 .subject-img {
      height: 80%;
      width: 100%;
      clip-path: ellipse(40% 50% at 50% 50%);
      margin-top: 10%;


      /* extra vintage */
}

.croyal-47 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 6rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-47 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-47 {
      background: #2e050c;
}

.croyal-48 .subject-img {
      height: 95%;
      width: 80%;

      border-radius: 50%;
      width: 250px;
      height: 250px;
      border: 4px solid #d4af37;
      box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);

      filter: sepia(40%) contrast(1.15) brightness(0.8) hue-rotate(-10deg);
      /* extra vintage */
}

.croyal-48 .hero-text {
      position: absolute;
      top: 8%;
      left: 8%;
      font-size: 1.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 400;
      font-family: 'Playfair Display', serif;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-48 .sub-text {
      position: absolute;
      bottom: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-48 {
      background: #4a0404;
}

.croyal-49 .subject-img {
      height: 110.00000000000001%;
      width: 100%;


      height: 50%;
      top: auto;
      bottom: 0;
      transform: translateX(-50%);
      /* extra vintage */
}

.croyal-49 .hero-text {
      position: absolute;
      top: 15%;
      bottom: auto;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.95;
      letter-spacing: 6px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;

      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9);
      z-index: 10;
}

.croyal-49 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-49 {
      background: #3b0918;
}

.croyal-50 .subject-img {
      height: 50%;
      width: 100%;



      /* extra vintage */
}

.croyal-50 .hero-text {
      position: absolute;
      bottom: 8%;
      right: 8%;
      font-size: 4.5rem;
      line-height: 0.95;
      letter-spacing: 1px;
      font-weight: 700;
      font-family: 'Playfair Display', serif;
      font-style: italic;
      ;
      writing-mode: vertical-rl;
      transform: rotate(180deg);
      right: 20px;
      left: auto;
      top: 15%;
      text-shadow: 2px 2px 0px rgba(212, 175, 55, 0.4), 4px 4px 10px rgba(0, 0, 0, 0.8);
      z-index: 10;
}

.croyal-50 .sub-text {
      position: absolute;
      top: 30px;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 4px;
      z-index: 10;
      color: #f4e8d1;
      /* warm ivory */
      text-transform: uppercase;
}

.croyal-50 {
      background: linear-gradient(to bottom, #4a0404, #0a1f16);
}

\n

/* =========================================================
   FLORAL MEMORY SCRAPBOOK COLLECTION
   ========================================================= */
.card-floral-scrap {
      background: #fdfaf5;
      /* Warm neutral cream */
      color: #4a4238;
      padding: 0;
      font-family: 'Playfair Display', serif;
}

.card-floral-scrap .card-inner {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
}

/* Paper texture overlay */
.card-floral-scrap .paper-texture {
      position: absolute;
      inset: 0;
      opacity: 0.6;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="4" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise)"/%3E%3C/svg%3E');
      mix-blend-mode: multiply;
      z-index: 1;
      pointer-events: none;
}

/* Base Shadowed Photo */
.card-floral-scrap .scrap-photo {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: relative;
      z-index: 5;
      box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
      /* Soft realistic shadow */
      filter: sepia(10%) contrast(0.95);
      /* Soft vintage grading */
}

/* Torn Edge Decoration wrapper */
.card-floral-scrap .torn-edge-wrapper {
      position: relative;
      z-index: 5;
      background: #fff;
      padding: 10px;
      box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.1);
      border-radius: 2px;
}

/* Realistic Layering */
.card-floral-scrap .scrap-flower {
      position: absolute;
      object-fit: contain;
      z-index: 8;
      /* Usually above photo */
      filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.15));
      pointer-events: none;
}

.card-floral-scrap .flower-behind {
      z-index: 4;
      /* Behind photo */
}

/* Tape Strip */
.card-floral-scrap .scrap-tape {
      position: absolute;
      background: rgba(255, 255, 255, 0.5);
      backdrop-filter: blur(2px);
      border-left: 2px dashed rgba(0, 0, 0, 0.1);
      border-right: 2px dashed rgba(0, 0, 0, 0.1);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
      z-index: 10;
}

/* Handwritten Script */
.card-floral-scrap .handwritten {
      font-family: 'Great Vibes', cursive;
      /* Using cursive font already loaded in index.html */
      color: #4a4238;
      z-index: 10;
      position: relative;
      text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.7);
}

.card-floral-scrap .typewriter {
      font-family: monospace;
      font-size: 0.75rem;
      letter-spacing: 2px;
      color: #555;
      background: rgba(255, 255, 255, 0.8);
      padding: 3px 8px;
      box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.05);
}

.csfloral-01 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Polaroid */
      border-radius: 25px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-01 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-01 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-01 .flower-1 {
      width: 130px;
      bottom: -20px;
      left: -20px;
      transform: rotate(15deg);
}

.csfloral-01 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-10deg);
}

.csfloral-01 {
      background: #fdf0eb;
}

.csfloral-02 .scrap-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-02 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-02 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-02 .flower-1 {
      width: 160px;
      top: -20px;
      right: -20px;
      transform: rotate(30deg);
}

.csfloral-02 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-20deg);
}

.csfloral-02 {
      background: #f5f3ef;
}

.csfloral-03 .scrap-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-03 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-03 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-03 .flower-1 {
      width: 190px;
      bottom: -20px;
      left: -20px;
      transform: rotate(45deg);
}

.csfloral-03 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-30deg);
}

.csfloral-03 {
      background: #eef2eb;
}

.csfloral-04 .scrap-photo {
      height: 90%;
      width: 90%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(10%, -10%);
      /* Offset frame */
}

.csfloral-04 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-04 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-04 .flower-1 {
      width: 220px;
      top: -20px;
      right: -20px;
      transform: rotate(60deg);
}

.csfloral-04 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-40deg);
}

.csfloral-04 {
      background: #f9f8f6;
}

.csfloral-05 .scrap-photo {
      height: 100%;
      width: 60%;
      margin: 0% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-05 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-05 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-05 .flower-1 {
      width: 100px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csfloral-05 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(0deg);
}

.csfloral-05 {
      background: #fdfaf5;
}

.csfloral-06 .scrap-photo {
      height: 50%;
      width: 100%;
      margin: 25% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-06 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-06 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-06 .flower-1 {
      width: 130px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csfloral-06 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-10deg);
}

.csfloral-06 {
      background: #fdf0eb;
}

.csfloral-07 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(-4deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-07 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-07 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-07 .flower-1 {
      width: 160px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csfloral-07 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-20deg);
}

.csfloral-07 {
      background: #f5f3ef;
}

.csfloral-08 .scrap-photo {
      height: 70%;
      width: 90%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      border-radius: 35px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-08 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-08 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-08 .flower-1 {
      width: 190px;
      top: -20px;
      right: -20px;
      transform: rotate(45deg);
}

.csfloral-08 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-30deg);
}

.csfloral-08 {
      background: #eef2eb;
}

.csfloral-09 .scrap-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-09 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-09 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-09 .flower-1 {
      width: 220px;
      bottom: -20px;
      left: -20px;
      transform: rotate(60deg);
}

.csfloral-09 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-40deg);
}

.csfloral-09 {
      background: #f9f8f6;
}

.csfloral-10 .scrap-photo {
      height: 90%;
      width: 60%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-10 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-10 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-10 .flower-1 {
      width: 100px;
      top: -20px;
      right: -20px;
      transform: rotate(0deg);
}

.csfloral-10 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(0deg);
}

.csfloral-10 {
      background: #fdfaf5;
}

.csfloral-11 .scrap-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(-10%, -10%);
      /* Offset frame */
}

.csfloral-11 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-11 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-11 .flower-1 {
      width: 130px;
      bottom: -20px;
      left: -20px;
      transform: rotate(15deg);
}

.csfloral-11 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-10deg);
}

.csfloral-11 {
      background: #fdf0eb;
}

.csfloral-12 .scrap-photo {
      height: 50%;
      width: 90%;
      margin: 25% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-12 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-12 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-12 .flower-1 {
      width: 160px;
      top: -20px;
      right: -20px;
      transform: rotate(30deg);
}

.csfloral-12 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-20deg);
}

.csfloral-12 {
      background: #f5f3ef;
}

.csfloral-13 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-13 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-13 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-13 .flower-1 {
      width: 190px;
      bottom: -20px;
      left: -20px;
      transform: rotate(45deg);
}

.csfloral-13 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-30deg);
}

.csfloral-13 {
      background: #eef2eb;
}

.csfloral-14 .scrap-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(6deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-14 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-14 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-14 .flower-1 {
      width: 220px;
      top: -20px;
      right: -20px;
      transform: rotate(60deg);
}

.csfloral-14 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-40deg);
}

.csfloral-14 {
      background: #f9f8f6;
}

.csfloral-15 .scrap-photo {
      height: 80%;
      width: 60%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      border-radius: 15px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-15 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-15 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-15 .flower-1 {
      width: 100px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csfloral-15 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(0deg);
}

.csfloral-15 {
      background: #fdfaf5;
}

.csfloral-16 .scrap-photo {
      height: 90%;
      width: 90%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-16 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-16 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-16 .flower-1 {
      width: 130px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csfloral-16 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-10deg);
}

.csfloral-16 {
      background: #fdf0eb;
}

.csfloral-17 .scrap-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-17 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-17 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-17 .flower-1 {
      width: 160px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csfloral-17 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-20deg);
}

.csfloral-17 {
      background: #f5f3ef;
}

.csfloral-18 .scrap-photo {
      height: 50%;
      width: 100%;
      margin: 25% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(10%, 10%);
      /* Offset frame */
}

.csfloral-18 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-18 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-18 .flower-1 {
      width: 190px;
      top: -20px;
      right: -20px;
      transform: rotate(45deg);
}

.csfloral-18 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-30deg);
}

.csfloral-18 {
      background: #eef2eb;
}

.csfloral-19 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-19 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-19 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-19 .flower-1 {
      width: 220px;
      bottom: -20px;
      left: -20px;
      transform: rotate(60deg);
}

.csfloral-19 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-40deg);
}

.csfloral-19 {
      background: #f9f8f6;
}

.csfloral-20 .scrap-photo {
      height: 70%;
      width: 90%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-20 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-20 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-20 .flower-1 {
      width: 100px;
      top: -20px;
      right: -20px;
      transform: rotate(0deg);
}

.csfloral-20 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(0deg);
}

.csfloral-20 {
      background: #fdfaf5;
}

.csfloral-21 .scrap-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(-3deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-21 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-21 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-21 .flower-1 {
      width: 130px;
      bottom: -20px;
      left: -20px;
      transform: rotate(15deg);
}

.csfloral-21 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-10deg);
}

.csfloral-21 {
      background: #fdf0eb;
}

.csfloral-22 .scrap-photo {
      height: 90%;
      width: 100%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      border-radius: 25px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-22 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-22 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-22 .flower-1 {
      width: 160px;
      top: -20px;
      right: -20px;
      transform: rotate(30deg);
}

.csfloral-22 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-20deg);
}

.csfloral-22 {
      background: #f5f3ef;
}

.csfloral-23 .scrap-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-23 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-23 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-23 .flower-1 {
      width: 190px;
      bottom: -20px;
      left: -20px;
      transform: rotate(45deg);
}

.csfloral-23 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-30deg);
}

.csfloral-23 {
      background: #eef2eb;
}

.csfloral-24 .scrap-photo {
      height: 50%;
      width: 90%;
      margin: 25% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-24 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-24 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-24 .flower-1 {
      width: 220px;
      top: -20px;
      right: -20px;
      transform: rotate(60deg);
}

.csfloral-24 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-40deg);
}

.csfloral-24 {
      background: #f9f8f6;
}

.csfloral-25 .scrap-photo {
      height: 60%;
      width: 60%;
      margin: 20% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(-10%, -10%);
      /* Offset frame */
}

.csfloral-25 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-25 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-25 .flower-1 {
      width: 100px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csfloral-25 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(0deg);
}

.csfloral-25 {
      background: #fdfaf5;
}

.csfloral-26 .scrap-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-26 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-26 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-26 .flower-1 {
      width: 130px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csfloral-26 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-10deg);
}

.csfloral-26 {
      background: #fdf0eb;
}

.csfloral-27 .scrap-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-27 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-27 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-27 .flower-1 {
      width: 160px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csfloral-27 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-20deg);
}

.csfloral-27 {
      background: #f5f3ef;
}

.csfloral-28 .scrap-photo {
      height: 90%;
      width: 90%;
      margin: 4.999999999999999% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(5deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-28 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-28 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-28 .flower-1 {
      width: 190px;
      top: -20px;
      right: -20px;
      transform: rotate(45deg);
}

.csfloral-28 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-30deg);
}

.csfloral-28 {
      background: #eef2eb;
}

.csfloral-29 .scrap-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Polaroid */
      border-radius: 35px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-29 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-29 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-29 .flower-1 {
      width: 220px;
      bottom: -20px;
      left: -20px;
      transform: rotate(60deg);
}

.csfloral-29 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-40deg);
}

.csfloral-29 {
      background: #f9f8f6;
}

.csfloral-30 .scrap-photo {
      height: 50%;
      width: 60%;
      margin: 25% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-30 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-30 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-30 .flower-1 {
      width: 100px;
      top: -20px;
      right: -20px;
      transform: rotate(0deg);
}

.csfloral-30 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(0deg);
}

.csfloral-30 {
      background: #fdfaf5;
}

.csfloral-31 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-31 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-31 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-31 .flower-1 {
      width: 130px;
      bottom: -20px;
      left: -20px;
      transform: rotate(15deg);
}

.csfloral-31 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-10deg);
}

.csfloral-31 {
      background: #fdf0eb;
}

.csfloral-32 .scrap-photo {
      height: 70%;
      width: 90%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(10%, -10%);
      /* Offset frame */
}

.csfloral-32 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-32 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-32 .flower-1 {
      width: 160px;
      top: -20px;
      right: -20px;
      transform: rotate(30deg);
}

.csfloral-32 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-20deg);
}

.csfloral-32 {
      background: #f5f3ef;
}

.csfloral-33 .scrap-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-33 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-33 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-33 .flower-1 {
      width: 190px;
      bottom: -20px;
      left: -20px;
      transform: rotate(45deg);
}

.csfloral-33 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-30deg);
}

.csfloral-33 {
      background: #eef2eb;
}

.csfloral-34 .scrap-photo {
      height: 90%;
      width: 100%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-34 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-34 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-34 .flower-1 {
      width: 220px;
      top: -20px;
      right: -20px;
      transform: rotate(60deg);
}

.csfloral-34 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-40deg);
}

.csfloral-34 {
      background: #f9f8f6;
}

.csfloral-35 .scrap-photo {
      height: 100%;
      width: 60%;
      margin: 0% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(-2deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-35 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-35 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-35 .flower-1 {
      width: 100px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csfloral-35 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(0deg);
}

.csfloral-35 {
      background: #fdfaf5;
}

.csfloral-36 .scrap-photo {
      height: 50%;
      width: 90%;
      margin: 25% auto;
      /* Polaroid */
      border-radius: 15px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-36 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-36 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-36 .flower-1 {
      width: 130px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csfloral-36 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-10deg);
}

.csfloral-36 {
      background: #fdf0eb;
}

.csfloral-37 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-37 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-37 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-37 .flower-1 {
      width: 160px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csfloral-37 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-20deg);
}

.csfloral-37 {
      background: #f5f3ef;
}

.csfloral-38 .scrap-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-38 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-38 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-38 .flower-1 {
      width: 190px;
      top: -20px;
      right: -20px;
      transform: rotate(45deg);
}

.csfloral-38 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-30deg);
}

.csfloral-38 {
      background: #eef2eb;
}

.csfloral-39 .scrap-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(-10%, 10%);
      /* Offset frame */
}

.csfloral-39 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-39 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-39 .flower-1 {
      width: 220px;
      bottom: -20px;
      left: -20px;
      transform: rotate(60deg);
}

.csfloral-39 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-40deg);
}

.csfloral-39 {
      background: #f9f8f6;
}

.csfloral-40 .scrap-photo {
      height: 90%;
      width: 90%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-40 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-40 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-40 .flower-1 {
      width: 100px;
      top: -20px;
      right: -20px;
      transform: rotate(0deg);
}

.csfloral-40 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(0deg);
}

.csfloral-40 {
      background: #fdfaf5;
}

.csfloral-41 .scrap-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-41 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-41 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-41 .flower-1 {
      width: 130px;
      bottom: -20px;
      left: -20px;
      transform: rotate(15deg);
}

.csfloral-41 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-10deg);
}

.csfloral-41 {
      background: #fdf0eb;
}

.csfloral-42 .scrap-photo {
      height: 50%;
      width: 100%;
      margin: 25% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(4deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-42 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-42 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-42 .flower-1 {
      width: 160px;
      top: -20px;
      right: -20px;
      transform: rotate(30deg);
}

.csfloral-42 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-20deg);
}

.csfloral-42 {
      background: #f5f3ef;
}

.csfloral-43 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Polaroid */
      border-radius: 25px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-43 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-43 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-43 .flower-1 {
      width: 190px;
      bottom: -20px;
      left: -20px;
      transform: rotate(45deg);
}

.csfloral-43 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-30deg);
}

.csfloral-43 {
      background: #eef2eb;
}

.csfloral-44 .scrap-photo {
      height: 70%;
      width: 90%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      /* Rounded corners */
      border: 4px solid #f4e8d1;
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-44 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-44 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-44 .flower-1 {
      width: 220px;
      top: -20px;
      right: -20px;
      transform: rotate(60deg);
}

.csfloral-44 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-40deg);
}

.csfloral-44 {
      background: #f9f8f6;
}

.csfloral-45 .scrap-photo {
      height: 80%;
      width: 60%;
      margin: 9.999999999999998% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      clip-path: ellipse(45% 50% at 50% 50%);
      /* Oval cut */
      /* Offset frame */
}

.csfloral-45 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-45 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-45 .flower-1 {
      width: 100px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csfloral-45 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(0deg);
}

.csfloral-45 {
      background: #fdfaf5;
}

.csfloral-46 .scrap-photo {
      height: 90%;
      width: 100%;
      margin: 4.999999999999999% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      border: 15px solid white;
      transform: translate(10%, -10%);
      /* Offset frame */
}

.csfloral-46 .handwritten {
      position: absolute;
      bottom: 25%;
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-46 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-46 .flower-1 {
      width: 130px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csfloral-46 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-10deg);
}

.csfloral-46 {
      background: #fdf0eb;
}

.csfloral-47 .scrap-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-47 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 10%;
      font-size: 6rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-47 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-47 .flower-1 {
      width: 160px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csfloral-47 .flower-2 {
      width: 140px;
      top: 15%;
      right: -10px;
      transform: rotate(-20deg);
}

.csfloral-47 {
      background: #f5f3ef;
}

.csfloral-48 .scrap-photo {
      height: 50%;
      width: 90%;
      margin: 25% auto;
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-48 .handwritten {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 3rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-48 .sub-text {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-48 .flower-1 {
      width: 190px;
      top: -20px;
      right: -20px;
      transform: rotate(45deg);
}

.csfloral-48 .flower-2 {
      width: 80px;
      bottom: 15%;
      left: -10px;
      transform: rotate(-30deg);
}

.csfloral-48 {
      background: #eef2eb;
}

.csfloral-49 .scrap-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      border: 10px solid white;
      border-bottom-width: 40px;
      transform: rotate(-6deg);
      /* Polaroid */
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-49 .handwritten {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 4rem;
      line-height: 0.9;
      transform: rotate(5deg);
}

.csfloral-49 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-49 .flower-1 {
      width: 220px;
      bottom: -20px;
      left: -20px;
      transform: rotate(60deg);
}

.csfloral-49 .flower-2 {
      width: 100px;
      top: 15%;
      right: -10px;
      transform: rotate(-40deg);
}

.csfloral-49 {
      background: #f9f8f6;
}

.csfloral-50 .scrap-photo {
      height: 70%;
      width: 60%;
      margin: 15.000000000000002% auto;
      /* Polaroid */
      border-radius: 35px;
      /* Rounded corners */
      /* Thin border */
      /* Oval cut */
      /* Offset frame */
}

.csfloral-50 .handwritten {
      position: absolute;
      bottom: 25%;
      right: 10%;
      font-size: 5rem;
      line-height: 0.9;
      transform: rotate(-5deg);
}

.csfloral-50 .sub-text {
      position: absolute;
      bottom: 10%;
      width: 100%;
      text-align: center;
      font-family: 'Inter', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 2px;
      z-index: 10;
      color: #6a6258;
}

.csfloral-50 .flower-1 {
      width: 100px;
      top: -20px;
      right: -20px;
      transform: rotate(0deg);
}

.csfloral-50 .flower-2 {
      width: 120px;
      bottom: 15%;
      left: -10px;
      transform: rotate(0deg);
}

.csfloral-50 {
      background: #fdfaf5;
}

/* =========================================================
   SOFT BOTANICAL SAGE COLLECTION
   ========================================================= */
.card-botanical-sage {
      background: #eef2ed;
      /* Base sage/cream */
      color: #4a5d4e;
      /* Deep sage text */
      padding: 0;
      font-family: 'Inter', sans-serif;
}

.card-botanical-sage .card-inner {
      position: relative;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
      /* No heavy vignettes, just clean */
}

/* Linen texture overlay - airy and breathable */
.card-botanical-sage .linen-texture {
      position: absolute;
      inset: 0;
      opacity: 0.25;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.75" numOctaves="2" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise)"/%3E%3C/svg%3E');
      mix-blend-mode: multiply;
      z-index: 15;
      pointer-events: none;
}

/* Base Photo - soft natural daylight look */
.card-botanical-sage .sage-photo {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: relative;
      z-index: 5;
      filter: sepia(10%) contrast(0.9) brightness(1.05);
      /* Warm ivory grading */
}

/* Botanical Ornaments */
.card-botanical-sage .sage-flora {
      position: absolute;
      object-fit: contain;
      z-index: 10;
      filter: drop-shadow(0 15px 15px rgba(0, 0, 0, 0.05)) opacity(0.8);
      pointer-events: none;
}

/* Typography styles - Minimal and thin */
.card-botanical-sage .sage-title {
      font-weight: 300;
      letter-spacing: 4px;
      line-height: 1.2;
      z-index: 10;
      position: relative;
      color: #3b4e3e;
}

.card-botanical-sage .sage-serif {
      font-family: 'Playfair Display', serif;
      font-style: italic;
      font-weight: 400;
}

.card-botanical-sage .sage-subtitle {
      font-family: 'Inter', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 5px;
      z-index: 10;
      color: #798a7b;
      /* lighter sage */
      text-transform: uppercase;
      font-weight: 400;
}

.csage-01 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-01 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-01 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-01 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(-30deg);
}

.csage-01 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-02 .sage-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-02 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-02 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-02 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-15deg);
}

.csage-02 {
      background: #f5f3ef;
}

.csage-03 .sage-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-03 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-03 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-03 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(0deg);
}

.csage-03 {
      background: #e3e8de;
}

.csage-04 .sage-photo {
      height: 90%;
      width: 85%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(5%, -5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-04 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-04 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-04 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csage-04 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-05 .sage-photo {
      height: 100%;
      width: 60%;
      margin: 0% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-05 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-05 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-05 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csage-05 {
      background: #eef2ed;
}

.csage-06 .sage-photo {
      height: 50%;
      width: 100%;
      margin: 25% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-06 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-06 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-06 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-45deg);
}

.csage-06 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-07 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-07 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-07 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-07 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(-30deg);
}

.csage-07 {
      background: #f5f3ef;
}

.csage-08 .sage-photo {
      height: 70%;
      width: 85%;
      margin: 15.000000000000002% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-08 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-08 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-08 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-15deg);
}

.csage-08 {
      background: #e3e8de;
}

.csage-09 .sage-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-09 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-09 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-09 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csage-09 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-10 .sage-photo {
      height: 90%;
      width: 60%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-10 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;
      writing-mode: vertical-rl;
      right: 10%;
      left: auto;
      top: 20%;
      transform: none;
      text-align: left;
}

.csage-10 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-10 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(15deg);
}

.csage-10 {
      background: #eef2ed;
}

.csage-11 .sage-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(-5%, -5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-11 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-11 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-11 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(30deg);
}

.csage-11 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-12 .sage-photo {
      height: 50%;
      width: 85%;
      margin: 25% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-12 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-12 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-12 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-45deg);
}

.csage-12 {
      background: #f5f3ef;
}

.csage-13 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: none;
}

.csage-13 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-13 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-13 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(-30deg);
}

.csage-13 {
      background: #e3e8de;
}

.csage-14 .sage-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-14 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-14 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-14 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-15deg);
}

.csage-14 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-15 .sage-photo {
      height: 80%;
      width: 60%;
      margin: 9.999999999999998% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-15 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-15 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-15 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(0deg);
}

.csage-15 {
      background: #eef2ed;
}

.csage-16 .sage-photo {
      height: 90%;
      width: 85%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-16 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-16 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-16 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csage-16 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-17 .sage-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-17 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-17 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-17 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csage-17 {
      background: #f5f3ef;
}

.csage-18 .sage-photo {
      height: 50%;
      width: 100%;
      margin: 25% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(5%, 5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-18 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-18 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-18 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-45deg);
}

.csage-18 {
      background: #e3e8de;
}

.csage-19 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-19 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-19 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-19 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(-30deg);
}

.csage-19 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-20 .sage-photo {
      height: 70%;
      width: 85%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: none;
}

.csage-20 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;
      writing-mode: vertical-rl;
      right: 10%;
      left: auto;
      top: 20%;
      transform: none;
      text-align: left;
}

.csage-20 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-20 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-15deg);
}

.csage-20 {
      background: #eef2ed;
}

.csage-21 .sage-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-21 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-21 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-21 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csage-21 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-22 .sage-photo {
      height: 90%;
      width: 100%;
      margin: 4.999999999999999% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-22 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-22 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-22 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(15deg);
}

.csage-22 {
      background: #f5f3ef;
}

.csage-23 .sage-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-23 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-23 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-23 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(30deg);
}

.csage-23 {
      background: #e3e8de;
}

.csage-24 .sage-photo {
      height: 50%;
      width: 85%;
      margin: 25% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-24 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-24 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-24 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-45deg);
}

.csage-24 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-25 .sage-photo {
      height: 60%;
      width: 60%;
      margin: 20% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(-5%, -5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-25 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-25 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-25 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(-30deg);
}

.csage-25 {
      background: #eef2ed;
}

.csage-26 .sage-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-26 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-26 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-26 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-15deg);
}

.csage-26 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-27 .sage-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-27 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-27 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-27 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(0deg);
}

.csage-27 {
      background: #f5f3ef;
}

.csage-28 .sage-photo {
      height: 90%;
      width: 85%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-28 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-28 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-28 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csage-28 {
      background: #e3e8de;
}

.csage-29 .sage-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-29 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-29 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-29 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csage-29 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-30 .sage-photo {
      height: 50%;
      width: 60%;
      margin: 25% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-30 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;
      writing-mode: vertical-rl;
      right: 10%;
      left: auto;
      top: 20%;
      transform: none;
      text-align: left;
}

.csage-30 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-30 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-45deg);
}

.csage-30 {
      background: #eef2ed;
}

.csage-31 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-31 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-31 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-31 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(-30deg);
}

.csage-31 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-32 .sage-photo {
      height: 70%;
      width: 85%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(5%, -5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-32 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-32 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-32 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-15deg);
}

.csage-32 {
      background: #f5f3ef;
}

.csage-33 .sage-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-33 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-33 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-33 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csage-33 {
      background: #e3e8de;
}

.csage-34 .sage-photo {
      height: 90%;
      width: 100%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: none;
}

.csage-34 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-34 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-34 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(15deg);
}

.csage-34 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-35 .sage-photo {
      height: 100%;
      width: 60%;
      margin: 0% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-35 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-35 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-35 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(30deg);
}

.csage-35 {
      background: #eef2ed;
}

.csage-36 .sage-photo {
      height: 50%;
      width: 85%;
      margin: 25% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-36 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-36 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-36 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-45deg);
}

.csage-36 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-37 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-37 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-37 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-37 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(-30deg);
}

.csage-37 {
      background: #f5f3ef;
}

.csage-38 .sage-photo {
      height: 70%;
      width: 100%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-38 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-38 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-38 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-15deg);
}

.csage-38 {
      background: #e3e8de;
}

.csage-39 .sage-photo {
      height: 80%;
      width: 100%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(-5%, 5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-39 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-39 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-39 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(0deg);
}

.csage-39 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-40 .sage-photo {
      height: 90%;
      width: 85%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-40 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;
      writing-mode: vertical-rl;
      right: 10%;
      left: auto;
      top: 20%;
      transform: none;
      text-align: left;
}

.csage-40 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-40 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(15deg);
}

.csage-40 {
      background: #eef2ed;
}

.csage-41 .sage-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: none;
}

.csage-41 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-41 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-41 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(30deg);
}

.csage-41 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-42 .sage-photo {
      height: 50%;
      width: 100%;
      margin: 25% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-42 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-42 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-42 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-45deg);
}

.csage-42 {
      background: #f5f3ef;
}

.csage-43 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-43 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-43 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-43 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(-30deg);
}

.csage-43 {
      background: #e3e8de;
}

.csage-44 .sage-photo {
      height: 70%;
      width: 85%;
      margin: 15.000000000000002% auto;
      /* Arch frame */
      clip-path: ellipse(40% 45% at 50% 50%);
      margin-top: 5%;
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-44 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-44 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-44 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-15deg);
}

.csage-44 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-45 .sage-photo {
      height: 80%;
      width: 60%;
      margin: 9.999999999999998% auto;
      /* Arch frame */
      /* Oval cut */
      border: 2px solid #bdc9bd;
      padding: 10px;
      background: white;
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-45 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-45 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-45 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(0deg);
}

.csage-45 {
      background: #eef2ed;
}

.csage-46 .sage-photo {
      height: 90%;
      width: 100%;
      margin: 4.999999999999999% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      transform: translate(5%, -5%);
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-46 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-46 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-46 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(15deg);
}

.csage-46 {
      background: #fdfcf8;
      color: #5a665b;
}

.csage-47 .sage-photo {
      height: 100%;
      width: 100%;
      margin: 0% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      clip-path: circle(40% at 50% 50%);
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-47 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;

}

.csage-47 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-47 .botanical-accent {
      width: 300px;
      bottom: 10%;
      right: -20px;
      transform: rotate(30deg);
}

.csage-47 {
      background: #f5f3ef;
}

.csage-48 .sage-photo {
      height: 50%;
      width: 85%;
      margin: 25% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      margin-left: 0;
      width: 60%;
      /* Left heavy */
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.csage-48 .sage-title {
      position: absolute;
      top: 10%;
      left: 10%;
      font-size: 1.5rem;

}

.csage-48 .sage-subtitle {
      position: absolute;
      bottom: 5%;
      width: 100%;
      text-align: center;
}

.csage-48 .botanical-accent {
      width: 150px;
      top: -20px;
      right: -20px;
      transform: rotate(-45deg);
}

.csage-48 {
      background: #e3e8de;
}

.csage-49 .sage-photo {
      height: 60%;
      width: 100%;
      margin: 20% auto;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-49 .sage-title {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 0;
      width: 100%;
      text-align: center;
      font-size: 2.5rem;

}

.csage-49 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-49 .botanical-accent {
      width: 200px;
      bottom: -20px;
      left: -20px;
      transform: rotate(-30deg);
}

.csage-49 {
      background: linear-gradient(to bottom, #fdfcf8, #dbe2d8);
}

.csage-50 .sage-photo {
      height: 70%;
      width: 60%;
      margin: 15.000000000000002% auto;
      border-radius: 200px 200px 0 0;
      /* Arch frame */
      /* Oval cut */
      /* Thin elegant border */
      /* Offset clean */
      /* Circle */
      /* Left heavy */
      box-shadow: none;
}

.csage-50 .sage-title {
      position: absolute;
      bottom: 10%;
      right: 10%;
      font-size: 3.5rem;
      writing-mode: vertical-rl;
      right: 10%;
      left: auto;
      top: 20%;
      transform: none;
      text-align: left;
}

.csage-50 .sage-subtitle {
      position: absolute;
      top: 5%;
      width: 100%;
      text-align: center;
}

.csage-50 .botanical-accent {
      width: 250px;
      top: 40%;
      left: -30px;
      transform: rotate(-15deg);
}

.csage-50 {
      background: #eef2ed;
}

/* ========================================= */
/* EDITOR VIEW STYLES                        */
/* ========================================= */

#editor-view {
      height: 100vh;
      width: 100%;
      display: flex;
      flex-direction: column;
      background: #fafafa;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1000;
      overflow: hidden;
      transition: opacity 0.3s ease, transform 0.3s ease;
}

#editor-view.hidden {
      opacity: 0;
      pointer-events: none;
      transform: translateY(20px);
}

.editor-top-bar {
      padding: 1.5rem 2rem;
      display: flex;
      align-items: center;
      background: white;
      border-bottom: 1px solid rgba(0, 0, 0, 0.05);
      z-index: 10;
}

#back-to-gallery {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      background: #f1f5f9;
      color: #334155;
      border: none;
      padding: 0.75rem 1.25rem;
      border-radius: 99px;
      font-weight: 600;
      font-size: 0.9rem;
      cursor: pointer;
      transition: all 0.2s ease;
}

#back-to-gallery:hover {
      background: #e2e8f0;
      color: #0f172a;
      transform: translateX(-2px);
}

.editor-container {
      display: flex;
      flex-direction: column-reverse;
      flex: 1;
      overflow-y: auto;
}

/* Customization Sidebar */
.editor-sidebar {
      width: 100%;
      background: white;
      border-bottom: 1px solid #e2e8f0;
      padding: 1.5rem;
      flex: none;
      z-index: 5;
}

.sidebar-header {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin-bottom: 2rem;
      color: #0f172a;
}

.sidebar-header h2 {
      font-size: 1.25rem;
      font-weight: 700;
      margin: 0;
      letter-spacing: -0.02em;
}

#customization-form {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
}

.form-group {
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
}

.form-group label {
      font-size: 0.8rem;
      font-weight: 600;
      color: #64748b;
      text-transform: uppercase;
      letter-spacing: 0.05em;
}

.glass-input {
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: 1rem;
      font-family: 'Inter', sans-serif;
      font-size: 0.95rem;
      color: #1e293b;
      transition: all 0.2s ease;
      width: 100%;
      box-sizing: border-box;
}

.glass-input:focus {
      outline: none;
      border-color: #6366f1;
      background: white;
      box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
}

.glass-input[readonly] {
      background: #f1f5f9;
      color: #94a3b8;
      cursor: not-allowed;
}

textarea.glass-input {
      resize: vertical;
      min-height: 100px;
}

.divider {
      border: none;
      border-top: 1px dashed #e2e8f0;
      margin: 0.5rem 0;
}

/* Live Preview Area */
.editor-preview-wrapper {
      width: 100%;
      min-height: 700px;
      flex: none;
      display: flex;
      flex-direction: column;
      background: #f1f5f9;
      background-image: radial-gradient(#cbd5e1 1px, transparent 0);
      background-size: 20px 20px;
      overflow: hidden;
      position: relative;
}

.preview-header {
      position: absolute;
      top: 2rem;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      align-items: center;
      gap: 0.5rem;
      background: rgba(255, 255, 255, 0.9);
      padding: 0.5rem 1rem;
      border-radius: 99px;
      font-size: 0.8rem;
      font-weight: 700;
      color: #64748b;
      letter-spacing: 0.05em;
      backdrop-filter: blur(10px);
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
      z-index: 10;
}

.preview-header svg {
      color: #22c55e;
}

.editor-preview {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 4rem 1rem 2rem 1rem;
      overflow-y: auto;
}

/* Ensure the cloned card looks good and retains fixed dimensions inside the preview */
.editor-preview .profile-card {
      position: relative;
      /* Strict dimensions to prevent changing size with text edits */
      width: 360px !important;
      height: 640px !important;
      min-width: 360px !important;
      min-height: 640px !important;
      max-width: 360px !important;
      max-height: 640px !important;
      overflow: hidden !important;
      margin: 0;
      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
      transition: none;
      /* Disable hover scale in editor */
      transform: scale(1);
      transform-origin: center center;
}

.editor-preview .profile-card:hover {
      transform: scale(1);
}

/* Hide gallery when editor is active */
body.editor-active {
      overflow: hidden;
}

body.editor-active>.page-container>.masonry-grid,
body.editor-active>.page-container>.hero-header {
      display: none !important;
}

/* Custom CSS for Spotify Iframe Container */
.spotify-embed-container {
      position: absolute;
      bottom: 2rem;
      left: 50%;
      transform: translateX(-50%);
      width: 90%;
      max-width: 320px;
      z-index: 50;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
      /* Make iframe glassmorphic background */
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(10px);
}

.spotify-embed-container iframe {
      width: 100%;
      height: 152px;
      /* Spotify compact player height */
      border: none;
      display: block;
}

/* Decorative constraints for Editor View - Desktop first inverted */
@media (min-width: 900px) {
      .editor-container {
            flex-direction: row;
            overflow: hidden;
      }

      .editor-sidebar {
            width: 400px;
            border-right: 1px solid rgba(0, 0, 0, 0.05);
            border-bottom: none;
            padding: 2rem;
            overflow-y: auto;
            box-shadow: 10px 0 30px rgba(0, 0, 0, 0.02);
            flex: 0 0 400px;
      }

      .editor-preview-wrapper {
            flex: 1;
            min-height: auto;
      }

      .editor-preview {
            padding: 2rem 4rem 4rem 4rem;
      }
}

/* Base mobile view fallback for very narrow screens */
@media (max-width: 400px) {
      .editor-preview .profile-card {
            transform: scale(0.85) !important;
      }
}

/* Back to Top Button */
#back-to-top {
      position: fixed;
      bottom: 20px;
      right: 20px;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(26, 31, 54, 0.8);
      color: white;
      border: 1px solid rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(10px);
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
      z-index: 1000;
      opacity: 0;
      visibility: hidden;
      transform: translateY(20px);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      padding: 0;
      cursor: pointer;
}

#back-to-top.visible {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
}

#back-to-top:hover {
      background: var(--primary);
      transform: translateY(-5px);
      box-shadow: 0 8px 25px rgba(79, 70, 229, 0.4);
}

@media (min-width: 640px) {
      #back-to-top {
            bottom: 40px;
            right: 40px;
            width: 60px;
            height: 60px;
      }
}