/* ====================================================================
   VELUR DESIGN-TOKENS — kanonische Basis (Quelle: Live-Homepage, .vlr.hub-Base-Block)
   Alles unter .vlr.hub scopen, damit Theme-CSS nicht hineinfärbt und umgekehrt.
   Schriften kommen vom Velur-Server (Karla via fonts.css, Cormorant Garamond
   via autoptimize-custom) — NIE Google-Fonts-CDN importieren.
==================================================================== */
.vlr.hub{
  /* Schrift */
  --font-serif:'Velur Hub Cormorant',Georgia,serif;
  --font-sans:'Velur Hub Karla',-apple-system,system-ui,sans-serif;

  /* Farbe */
  --gold:#b8956a;        /* Akzent-Gold: Linien, Haken, Overlay-Tint — nur auf hellem Grund oder über Fotos */
  --gold-ink:#8a6a3f;    /* dunkleres Gold für Text/Icons/Fokus, wo mehr Kontrast nötig ist */
  --dark:#1a1a1a;        /* Ink: Headlines, Buttons, dunkle Flächen */
  --text:#2c2c2c;        /* Fließtext */
  --text-light:#6b6b6b;  /* gedämpfter Text, Subtitles, Mikrotext */
  --bg:#ffffff;          /* Standard-Seitenhintergrund */
  --mist:#f4f4f4;        /* neutrale Medien- und Hilfsfläche */
  --line:#dedede;         /* universelle Haarlinie */
  --bg-warm:#f8f6f3;     /* seltene Editorial-Ausnahme; nie Checkout/Thank You/Account/Formulare */
  --border:var(--line);   /* Alias für bestehende Komponenten */
  --tp-green:#00855a;    /* NUR Trustpilot-Branding */

  /* Typo-Skala (em-basiert, skaliert mit Root-Clamp) */
  --fs-2xs:.6875em; --fs-xs:.75em; --fs-sm:.875em; --fs-base:1em; --fs-md:1.125em; --fs-lg:1.375em;
  --lh-tight:1.18; --lh-snug:1.3; --lh-body:1.6;

  /* Layout & Motion */
  --max-width:1320px;
  --section-pad:clamp(56px,6vw,96px);
  --ease-lux:cubic-bezier(.22,1,.36,1);

  font-family:var(--font-sans);
  font-size:clamp(16px, 11px + 0.5vw, 22px);
  line-height:var(--lh-body);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}

/* Reset innerhalb des Scopes */
.vlr.hub, .vlr.hub *, .vlr.hub *::before, .vlr.hub *::after{ box-sizing:border-box; }
.vlr.hub h1,.vlr.hub h2,.vlr.hub h3,.vlr.hub h4,.vlr.hub h5,.vlr.hub h6{ margin:0; font-weight:400; color:var(--dark); line-height:var(--lh-tight); }
.vlr.hub p{ margin:0; }
.vlr.hub a{ color:inherit; text-decoration:none; }
.vlr.hub img{ display:block; max-width:100%; height:auto; }
.vlr.hub button{ font-family:inherit; }
.vlr.hub ul{ list-style:none; margin:0; padding:0; }

/* Container */
.vlr.hub .container{ max-width:var(--max-width); margin:0 auto; padding:0 clamp(20px,4vw,60px); }

/* Eyebrow + Gold-Thread — optionaler Editorial-Akzent, kein Pflichtmuster */
.vlr.hub .section-eyebrow{ font-family:var(--font-sans); font-size:var(--fs-2xs); font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-ink); }
.vlr.hub .gold-thread{ display:block; height:1px; width:56px; background:var(--gold); margin-top:14px; }
.vlr.hub .gold-thread--center{ margin-left:auto; margin-right:auto; }

/* Buttons */
.vlr.hub .btn-outline{ display:inline-block; font-family:var(--font-sans); font-size:var(--fs-xs); font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--dark); border:1px solid var(--dark); padding:14px 32px; background:transparent; transition:background-color .3s ease,color .3s ease,transform .15s ease; cursor:pointer; }
.vlr.hub .btn-outline:hover{ background:var(--dark); color:#fff; }
.vlr.hub .btn-outline:active{ transform:translateY(1px); }
.vlr.hub .btn-solid{ display:inline-block; font-family:var(--font-sans); font-size:var(--fs-xs); font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:#fff; background:var(--dark); padding:16px 40px; border:1px solid var(--dark); transition:background-color .3s ease,color .3s ease,transform .15s ease; cursor:pointer; }
.vlr.hub .btn-solid:hover{ background:transparent; color:var(--dark); }
.vlr.hub .btn-solid:active{ transform:translateY(1px); }

/* Sichtbarer Tastatur-Fokus (auf hellem Grund; über Fotos/dunkel: outline-color #fff) */
.vlr.hub a:focus-visible,.vlr.hub button:focus-visible,.vlr.hub summary:focus-visible{ outline:2px solid var(--dark); outline-offset:3px; border-radius:2px; }


body.velur-collection-hub-page{background:#fff}
.vlr.hub{width:100%;max-width:none;padding:0;margin:0;float:none}
.vlr.hub a{border-radius:0;box-shadow:none}
.vlr.hub h1,.vlr.hub h2,.vlr.hub h3{padding:0;text-transform:none}
.vlr.hub .breadcrumb{background:transparent;margin:0;border:0;list-style:none}
.vlr.hub .section{margin:0;padding-bottom:0}
@font-face{font-family:'Velur Hub Karla';src:url(../fonts/karla-v31-latin_latin-ext-regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Velur Hub Karla';src:url(../fonts/karla-v31-latin_latin-ext-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Velur Hub Cormorant';src:url(../fonts/cormorant-garamond-v16-latin-regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Velur Hub Cormorant';src:url(../fonts/cormorant-garamond-v16-latin-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
/* VEL-20260922-COLLECTION-HUB: page-local approved composition. */

.vlr.hub{font-size:clamp(16px,11px + .5vw,22px);background:var(--bg);color:var(--text);line-height:1.6}
.vlr.hub *{box-sizing:border-box}
.vlr.hub .hub-container{max-width:1440px;padding:0 clamp(20px,4.17vw,60px);margin:auto}
.vlr.hub .breadcrumb{display:flex;gap:12px;align-items:center;color:var(--text-light);font-size:.69em;padding-top:13px}
.vlr.hub .breadcrumb a{display:flex;align-items:center;min-height:44px}
.vlr.hub .intro{padding:42px 0}
.vlr.hub .eyebrow{font-size:.62em;letter-spacing:.16em;text-transform:uppercase;color:var(--text-light);font-weight:500;display:block}
.vlr.hub h1,.vlr.hub h2,.vlr.hub h3{font-family:var(--font-serif)}
.vlr.hub h1{font-size:clamp(38px,4.25vw,62px);line-height:1.05;letter-spacing:-.025em;margin:13px 0 0}
.vlr.hub .jump-nav{display:flex;gap:36px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:5px 0}
.vlr.hub .jump-nav a{font-size:.68em;letter-spacing:.06em;display:flex;gap:20px;align-items:center;min-height:44px}
.vlr.hub .jump-nav span{color:var(--text-light)}
.vlr.hub .section{padding-top:72px;scroll-margin-top:24px}
.vlr.hub .love{padding-top:40px}
.vlr.hub .section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:25px}
.vlr.hub h2{font-size:clamp(30px,2.8vw,40px);line-height:1.15;letter-spacing:-.015em}
.vlr.hub .section-heading p{font-size:.79em;color:var(--text-light)}
.vlr.hub .feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.vlr.hub .photo{overflow:hidden;background:var(--mist)}
.vlr.hub .photo img{width:100%;height:100%;object-fit:cover;transition:transform .3s var(--ease-lux);filter:saturate(.92) contrast(1.02)}
.vlr.hub .featured .photo{aspect-ratio:1.62}
.vlr.hub .engagement img{object-position:50% 63%}
.vlr.hub .wedding img{object-position:50% 48%}
.vlr.hub .card-copy{display:flex;justify-content:space-between;align-items:start;gap:15px;padding-top:16px}
.vlr.hub h3{font-size:clamp(25px,2.4vw,34px);line-height:1.2;letter-spacing:-.01em}
.vlr.hub .card-copy p{color:var(--text-light);font-size:.82em;margin-top:5px}
.vlr.hub .arrow{font-size:1.1em;line-height:1.6}
.vlr.hub .collection-card:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
@media(hover:hover){.vlr.hub .collection-card:hover .photo img{transform:scale(1.025)}}
.vlr.hub .ring-links{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:34px}
.vlr.hub .ring-links a{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:19px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}
.vlr.hub .ring-title{font-family:var(--font-serif);font-size:1.44em;color:var(--dark);display:block;margin-top:3px}
.vlr.hub .ring-links a:hover .ring-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.vlr.hub .jewelry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.vlr.hub .small-card .photo{aspect-ratio:1/1.16}
.vlr.hub .small-card .card-copy{align-items:center;padding-top:14px}
.vlr.hub .small-card h3{font-size:1.64em}
.vlr.hub .meaning-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.vlr.hub .story-card{display:grid;grid-template-columns:1fr 1fr;background:var(--mist)}
.vlr.hub .story-card .photo{height:365px;min-height:0}
.vlr.hub .birthstones .photo img{object-position:50% 53%}
.vlr.hub .clover .photo img{object-position:48% 50%}
.vlr.hub .story-copy{padding:30px 24px;display:flex;align-items:start;justify-content:center;flex-direction:column}
.vlr.hub .story-copy h3{font-size:1.65em;margin-top:14px;overflow-wrap:anywhere}
.vlr.hub .story-copy p{font-size:.82em;color:var(--text-light);margin-top:12px}
.vlr.hub .text-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;font-size:.62em;font-weight:500;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--dark);line-height:1.6}
.vlr.hub .story-copy .text-cta{margin-top:24px}
.vlr.hub .gift-section{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.vlr.hub .gift-photo img{width:100%;height:360px;object-fit:cover;object-position:center}
.vlr.hub .gift-copy h2{font-size:clamp(34px,3.4vw,48px);margin:15px 0 18px}
.vlr.hub .gift-copy>p:not(.eyebrow){font-size:.88em;color:var(--text-light);max-width:440px}
.vlr.hub .gift-links{display:flex;align-items:start;flex-direction:column;gap:12px;margin-top:24px}
.vlr.hub .btn-outline,.vlr.hub .btn-solid{font-size:.62em;min-height:48px;display:inline-flex;align-items:center;justify-content:center;line-height:1.5;text-align:center;letter-spacing:.12em}
.vlr.hub .consult{margin-top:80px;padding:44px 0 56px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px}
.vlr.hub .consult h2{margin:10px 0;font-size:clamp(30px,2.7vw,38px)}
.vlr.hub .consult p:not(.eyebrow){font-size:.85em;color:var(--text-light)}
.vlr.hub .consult .btn-solid{flex-shrink:0}
@media(max-width:1100px){.vlr.hub .story-card{grid-template-columns:1fr}.vlr.hub .story-card .photo{min-height:0;height:330px}.vlr.hub .story-copy{padding:26px}.vlr.hub .story-copy h3{overflow-wrap:normal}.vlr.hub .clover .photo img{object-fit:contain}.vlr.hub .gift-section{gap:40px}}
@media(max-width:700px){
 .vlr.hub .breadcrumb{padding-top:4px;font-size:.7em}.vlr.hub .intro{padding:25px 0 28px}.vlr.hub h1{font-size:clamp(36px,9.8vw,48px);margin-top:10px;line-height:1.1}
 .vlr.hub .jump-nav{display:grid;grid-template-columns:1.2fr 1fr;gap:0 20px;padding:6px 0}.vlr.hub .jump-nav a{justify-content:space-between;gap:8px;font-size:.72em;letter-spacing:0}
 .vlr.hub .section{padding-top:48px}.vlr.hub .love{padding-top:32px}.vlr.hub .section-heading{display:block;margin-bottom:22px}.vlr.hub .section-heading p{font-size:.9em;margin-top:10px}
 .vlr.hub .feature-grid{grid-template-columns:1fr;gap:28px}.vlr.hub .featured .photo{aspect-ratio:1.3}.vlr.hub h3{font-size:29px}.vlr.hub .card-copy p{font-size:.92em}
 .vlr.hub .ring-links{grid-template-columns:1fr;gap:0;margin-top:28px}.vlr.hub .ring-links a{border-bottom:0;padding:16px 0}.vlr.hub .ring-links a:last-child{border-bottom:1px solid var(--line)}.vlr.hub .ring-title{font-size:1.6em}
 .vlr.hub .jewelry-grid{grid-template-columns:1fr 1fr;gap:24px 16px}.vlr.hub .small-card .photo{aspect-ratio:1/1.15}.vlr.hub .small-card h3{font-size:1.5em}.vlr.hub .small-card .card-copy{gap:5px;padding-top:10px}.vlr.hub .arrow{font-size:1em}
 .vlr.hub .meaning-grid{grid-template-columns:1fr;gap:24px}.vlr.hub .story-card{grid-template-columns:1fr}.vlr.hub .story-card .photo{height:300px}.vlr.hub .birthstones .photo img{object-position:center 55%}.vlr.hub .clover .photo img{object-fit:cover}.vlr.hub .story-copy{padding:24px}.vlr.hub .story-copy h3{font-size:30px}.vlr.hub .story-copy p{font-size:1em}.vlr.hub .text-cta{font-size:.72em}
 .vlr.hub .gift-section{grid-template-columns:1fr;gap:25px}.vlr.hub .gift-photo img{height:260px}.vlr.hub .gift-copy>p:not(.eyebrow){font-size:1em}.vlr.hub .gift-links{align-items:stretch}.vlr.hub .gift-links .text-cta{align-self:start}.vlr.hub .btn-outline,.vlr.hub .btn-solid{font-size:.69em;padding:15px 18px}
 .vlr.hub .consult{margin-top:48px;display:block;padding:32px 0 40px}.vlr.hub .consult p:not(.eyebrow){font-size:1em}.vlr.hub .consult .btn-solid{display:flex;margin-top:24px;width:100%}
}
@media(prefers-reduced-motion:reduce){.vlr.hub *{transition:none!important}.vlr.hub .collection-card:hover .photo img{transform:none}}

.vlr.hub h1 em,.vlr.hub h2 em,.vlr.hub h3 em{font-family:inherit;font-weight:inherit;font-style:italic}