/* =========================================================
   MY DESTINY — Homepage-only editorial system.
   Loaded ONLY by index.html, on top of style.css (shared
   tokens, header, reset, fonts). Nothing here leaks onto
   other pages. No gradients. No shadows. No boxed cards.
   Reference: alternating photo/text splits, small-caps serif
   headlines, hairline swash dividers, circular arrow CTAs.
   ========================================================= */

body.home{ background: var(--ivory); }

/* ---------- header, homepage treatment ---------- */
body.home .site-header .wordmark{ display:flex; align-items:center; color: var(--graphite); }
body.home .site-header .wordmark svg{ height: 34px; width:auto; display:block; }
body.home .nav-primary a{ font-variant: small-caps; letter-spacing:.14em; }

/* ---------- small-caps editorial type ---------- */
.sc{ font-variant: small-caps; }
.ed-eyebrow{
  font-size:.7rem; letter-spacing:.32em; text-transform:uppercase;
  color: var(--sapphire); font-weight:500;
}
.ed-h2{
  font-family: var(--font-display); font-weight:400; font-variant: small-caps;
  font-size: clamp(1.9rem,3.6vw,2.7rem); line-height:1.22; color: var(--graphite);
  margin-top:.9rem;
}

/* swash divider — a small hand-drawn-like flourish under headlines */
.ed-swash{ margin: 1.1rem 0 1.4rem; opacity:.75; }
.ed-swash svg{ width:70px; height:22px; }
.ed-swash path{ fill:none; stroke: var(--sapphire); stroke-width:1; stroke-linecap:round; }

.ed-section{ padding: clamp(5rem,10vw,8rem) 0; position:relative; }

/* ---------- circular arrow CTA (primary) ---------- */
.ed-cta{
  display:inline-flex; align-items:center; gap:1rem;
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color: var(--graphite);
}
.ed-cta .circle{
  width:40px; height:40px; border-radius:50%;
  border:1px solid rgba(51,51,51,.32);
  display:flex; align-items:center; justify-content:center;
  transition: background .45s var(--ease), border-color .45s var(--ease);
  flex:none;
}
.ed-cta .circle svg{ width:13px; height:13px; transition: transform .45s var(--ease), stroke .45s var(--ease); }
.ed-cta .circle svg *{ stroke: var(--graphite); fill:none; }
.ed-cta:hover .circle{ background: var(--sapphire); border-color: var(--sapphire); }
.ed-cta:hover .circle svg *{ stroke: #fff; }
.ed-cta:hover .circle svg{ transform: translateX(2px); }

/* secondary link — thin underline, reuses global .link-underline */

/* ---------- flat gradient-free photo used only on this page ---------- */
.ed-photo{ position:relative; overflow:hidden; background: var(--linen); }
.ed-photo::before{
  content:""; position:absolute; inset:0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='13' fill='none' stroke='%235f7f99' stroke-width='.6' opacity='.5'/%3E%3Ccircle cx='32' cy='32' r='3' fill='%235f7f99' opacity='.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:52px; opacity:.7;
}
.ed-photo::after{
  content: attr(data-hint); position:absolute; left:0; right:0; bottom:1.1rem; text-align:center;
  font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color: var(--graphite-soft); opacity:.7; padding:0 1rem;
}
.ed-photo img{ position:relative; z-index:1; width:100%; height:100%; object-fit:cover; opacity:0; transition: opacity 1.1s var(--ease), transform 2.2s var(--ease); }
.ed-photo img.is-loaded{ opacity:1; }
.ed-photo.has-image::before, .ed-photo.has-image::after{ opacity:0; }
.ed-photo.zoom:hover img{ transform: scale(1.045); }

/* =========================================================
   SECTION 01 — HERO
   ========================================================= */
.ed-hero{
  display:grid; grid-template-columns: 38% 62%;
  min-height: 100svh; position:relative;
  padding: 0;
}
.ed-hero-type{
  display:flex; flex-direction:column; justify-content:center;
  padding: clamp(6rem,9vw,7.5rem) clamp(1.8rem,5vw,4.5rem) clamp(3rem,6vw,4.5rem);
}
.ed-hero-type h1{
  font-family: var(--font-display); font-weight:400; font-variant: small-caps;
  font-size: clamp(2.3rem,4vw,3.4rem); line-height:1.14; color: var(--graphite);
  margin-top:1rem; max-width:11ch;
}
.ed-hero-actions{ margin-top: 2.2rem; }
.ed-hero-media{ position:relative; overflow:hidden; }
.ed-hero-media .ed-photo{ height:100%; }

.ed-hero-counter{
  position:absolute; top: clamp(6.5rem,10vw,8.5rem); right: clamp(1.4rem,3vw,2.4rem); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:.7rem;
  font-size:.72rem; letter-spacing:.06em; color: rgba(255,253,250,.92);
}
.ed-hero-counter .bar{ width:1px; height:60px; background: rgba(255,253,250,.55); }

.ed-hero-nav{
  position:absolute; right: clamp(1.4rem,3vw,2.4rem); bottom: clamp(1.4rem,3vw,2.4rem); z-index:2;
  display:flex; gap:.7rem;
}
.ed-hero-nav button{
  width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,253,250,.55);
  display:flex; align-items:center; justify-content:center; color:#fff;
  transition: background .4s var(--ease), border-color .4s var(--ease);
}
.ed-hero-nav button:hover{ background: rgba(255,253,250,.16); border-color:#fff; }
.ed-hero-nav svg{ width:11px; height:11px; }
.ed-hero-nav svg *{ stroke:#fff; fill:none; }

@media (max-width:960px){
  .ed-hero{ grid-template-columns:1fr; min-height:auto; }
  .ed-hero-media{ height:60vh; order:-1; }
  .ed-hero-type{ padding-top: clamp(3rem,7vw,4.5rem); }
  .ed-hero-counter{ display:none; }
}

/* =========================================================
   SECTION 02 / 03 — ALTERNATING SPLITS (About · Ethical Breeding)
   reuses the sitewide .split / .split.reverse grid, restyled
   ========================================================= */
.ed-split{ align-items:stretch; }
.ed-split .ed-photo{ min-height: 48vh; height:100%; }
.ed-split-copy{ display:flex; flex-direction:column; justify-content:center; padding: clamp(1.5rem,4vw,0) clamp(0rem,2vw,1rem); }
.ed-split-copy p{ margin-top:1.1rem; color: var(--graphite-soft); font-size:1rem; line-height:1.85; max-width:42ch; }

/* =========================================================
   SECTION — QUOTE (no overlay, no gradient)
   ========================================================= */
.ed-quote-photo{ height: 66vh; }
@media (max-width: 760px){ .ed-quote-photo img{ object-position: 72% 50%; } }
.ed-quote{ text-align:center; padding: clamp(3rem,7vw,5rem) 0 clamp(1.5rem,4vw,3rem); }
.ed-quote p{
  font-family: var(--font-display); font-style:italic; font-weight:400;
  font-size: clamp(1.6rem,3.2vw,2.3rem); color: var(--graphite);
  max-width: 18ch; margin:0 auto; line-height:1.35;
}

/* =========================================================
   SECTION — PROMISE / ICON GRID
   ========================================================= */
.ed-promise-grid{
  display:grid; grid-template-columns: repeat(4,1fr);
  gap: clamp(1rem,2vw,1.4rem);
}
.ed-promise-item{
  background: var(--white);
  border: 1px solid rgba(51,51,51,.10);
  border-radius: 6px;
  padding: clamp(2.2rem,4vw,2.8rem) clamp(1rem,2.5vw,1.6rem);
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:1.1rem;
  min-height: 190px; justify-content:center;
  box-shadow: 0 1px 3px rgba(52,52,58,.04);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.ed-promise-item:hover{
  transform: translateY(-5px);
  box-shadow: 0 16px 32px rgba(52,52,58,.09);
  border-color: rgba(95,127,153,.35);
}
.ed-promise-item .ico-wrap{
  width: 58px; height: 58px; border-radius: 50%;
  background: var(--eye-blue-pale);
  display:flex; align-items:center; justify-content:center;
  flex: none;
}
.ed-promise-item svg{ width:26px; height:26px; }
.ed-promise-item svg *{ fill:none; stroke: var(--sapphire-deep); stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; }
.ed-promise-item .label{ font-size:.78rem; letter-spacing:.04em; color: var(--graphite); line-height:1.4; }
@media (max-width:860px){ .ed-promise-grid{ grid-template-columns:repeat(2,1fr); } }

/* =========================================================
   SECTION — WORLDWIDE DELIVERY (line-art globe)
   ========================================================= */
.ed-delivery{ background: var(--linen); }
.ed-delivery-grid{ display:grid; grid-template-columns: 1fr 1fr; align-items:center; gap: clamp(2rem,6vw,4.5rem); }
.ed-delivery-map{ width:100%; height:auto; max-width:380px; margin:0 auto; display:block; }
@media (max-width:860px){ .ed-delivery-grid{ grid-template-columns:1fr; } .ed-delivery-map{ order:-1; } }

/* =========================================================
   SECTION — FEATURED CATS
   ========================================================= */
.ed-cats-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: clamp(1rem,2.5vw,1.6rem); }
.ed-cats-grid .ed-photo{ height: 52vh; }
.ed-cat-caption{ margin-top:1rem; display:flex; justify-content:space-between; align-items:baseline; gap:1rem; }
.ed-cat-caption .name{ font-family:var(--font-display); font-variant:small-caps; font-size:1.15rem; }
.ed-cat-caption .role{ font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color: var(--sapphire); }
@media (max-width:760px){ .ed-cats-grid{ grid-template-columns:1fr; } }

/* =========================================================
   SLIDER (Featured Cats / Available Kittens, shared)
   ========================================================= */
.ed-slider-wrap{ position:relative; }
.ed-slider{
  display:flex; gap: clamp(1rem,2.5vw,1.6rem);
  overflow-x:auto; scroll-snap-type:x mandatory;
  padding: .3rem .3rem 1rem;
  margin: 0 -.3rem;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ed-slider::-webkit-scrollbar{ display:none; height:0; }
.ed-slider > a{ flex: 0 0 auto; width: min(72vw, 300px); scroll-snap-align: start; display:block; }
.ed-slider .ed-photo{ height: 58vh; max-height: 420px; }
.ed-slider .ed-cat-caption, .ed-slider .cap{ margin-top: 1rem; }
.ed-slider-nav{ display:flex; justify-content:flex-end; gap:.7rem; margin-top: 1.2rem; }
.ed-slider-nav button{
  width:42px; height:42px; border-radius:50%;
  border:1px solid rgba(51,51,51,.28);
  display:flex; align-items:center; justify-content:center;
  transition: background .4s var(--ease), border-color .4s var(--ease);
}
.ed-slider-nav button svg{ width:13px; height:13px; }
.ed-slider-nav button svg *{ stroke: var(--graphite); fill:none; transition: stroke .4s var(--ease); }
.ed-slider-nav button:hover{ background: var(--sapphire); border-color: var(--sapphire); }
.ed-slider-nav button:hover svg *{ stroke: #fff; }

/* =========================================================
   SECTION — AVAILABLE KITTENS
   ========================================================= */
.ed-kittens-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: clamp(1rem,2.2vw,1.6rem); }
.ed-kittens-grid a{ display:block; }
.ed-kittens-grid .ed-photo{ height: 46vh; }
.ed-kittens-grid .cap{ margin-top:.9rem; text-align:center; }
.ed-kittens-grid .cap .name{ font-family:var(--font-display); font-variant:small-caps; font-size:1.2rem; }
.ed-kittens-grid .cap .trait{ display:block; margin-top:.3rem; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color: var(--graphite-soft); }
@media (max-width:760px){ .ed-kittens-grid{ grid-template-columns:1fr; } }

/* =========================================================
   SECTION — PHILOSOPHY
   ========================================================= */
.ed-philosophy{ text-align:center; }
.ed-values{ display:flex; justify-content:center; align-items:baseline; gap: clamp(1.2rem,4vw,3rem); flex-wrap:wrap; margin-top: clamp(1.8rem,4vw,3rem); }
.ed-values .value{ display:flex; flex-direction:column; align-items:center; gap:.6rem; }
.ed-values .value .word{
  font-family: var(--font-display); font-weight:400; font-variant:small-caps;
  font-size: clamp(2rem,5.6vw,3.6rem); line-height:1; color: var(--graphite);
}
.ed-values .value .tag{ font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; color: var(--sapphire); }
.ed-values .sep{ width:1px; height:46px; background: rgba(51,51,51,.16); align-self:center; }
@media (max-width:760px){ .ed-values{ flex-direction:column; gap:1.8rem; } .ed-values .sep{ display:none; } }

/* =========================================================
   SECTION — QUICK LINKS STRIP (Our Cats / Kittens / Contact)
   ========================================================= */
.ed-quicklinks{ display:grid; grid-template-columns: repeat(3,1fr); }
.ed-quicklinks a{ display:block; position:relative; }
.ed-quicklinks .ed-photo{ height: 40vh; }
.ed-quicklinks .ql-copy{ padding: 1.4rem clamp(1rem,2.5vw,1.6rem) 0; }
.ed-quicklinks .ql-copy .t{ font-family:var(--font-display); font-variant:small-caps; font-size:1.15rem; }
.ed-quicklinks .ql-copy p{ margin-top:.4rem; font-size:.88rem; color: var(--graphite-soft); max-width:26ch; }
.ed-quicklinks .ql-copy .circle{ margin-top:1rem; }
@media (max-width:760px){ .ed-quicklinks{ grid-template-columns:1fr; } }

/* =========================================================
   SECTION — INSTAGRAM MASONRY
   ========================================================= */
.ed-insta-grid{ display:grid; grid-template-columns: repeat(4,1fr); grid-auto-rows: 15vw; gap:.5rem; }
.ed-insta-grid .ed-photo{ width:100%; height:100%; }
.ed-insta-grid a:nth-child(1){ grid-column: span 2; grid-row: span 2; }
.ed-insta-grid a:nth-child(4){ grid-row: span 2; }
.ed-insta-grid a:nth-child(6){ grid-column: span 2; }
.ed-insta-grid--four{ grid-auto-rows: 22vw; }
.ed-insta-grid--four a:nth-child(1){ grid-column: span 1; grid-row: span 1; }
.ed-insta-grid--four a:nth-child(4){ grid-row: span 1; }
@media (max-width:760px){
  .ed-insta-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:28vw; }
  .ed-insta-grid a:nth-child(1){ grid-column:span 2; grid-row:span 1; }
  .ed-insta-grid--four{ grid-auto-rows: 40vw; }
  .ed-insta-grid--four a:nth-child(1){ grid-column: span 1; grid-row: span 1; }
}

/* =========================================================
   SECTION — CONTACT
   ========================================================= */
.ed-contact-list{ max-width: 620px; margin: clamp(2rem,5vw,3.2rem) auto 0; }
.ed-contact-row{ display:flex; align-items:center; justify-content:space-between; padding: 1.3rem 0; border-bottom:1px solid rgba(51,51,51,.14); }
.ed-contact-row .k{ font-size:.68rem; letter-spacing:.22em; text-transform:uppercase; color: var(--sapphire); }
.ed-contact-row .v{ font-family: var(--font-display); font-size:1.1rem; }
.ed-contact-row a.v{ position:relative; }
.ed-contact-row a.v::after{ content:""; position:absolute; left:0; right:100%; bottom:-3px; height:1px; background:var(--sapphire); transition:right .45s var(--ease); }
.ed-contact-row a.v:hover::after{ right:0; }

/* =========================================================
   MINIMAL FOOTER (homepage only) — monogram / nav / seal
   ========================================================= */
.ed-footer{ padding: clamp(3rem,6vw,4.5rem) 0 clamp(1.6rem,3vw,2rem); }
.ed-footer-row{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.ed-footer .mono{ width:40px; height:40px; color: var(--graphite); }
.ed-footer .mono path, .ed-footer .mono circle{ fill:none; stroke:currentColor; }
.ed-footer nav{ display:flex; justify-content:center; flex-wrap:wrap; gap: clamp(1.1rem,2.6vw,2rem); }
.ed-footer nav a{ font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color: var(--graphite-soft); }
.ed-footer nav a:hover{ color: var(--sapphire-deep); }
.ed-footer .seal{ width:64px; height:64px; color: var(--graphite-soft); flex:none; }
.ed-footer .seal path, .ed-footer .seal circle{ fill:none; stroke:currentColor; }
.ed-footer .seal text{ fill: currentColor; }
.ed-footer .copy{ margin-top:2rem; text-align:center; font-size:.68rem; letter-spacing:.05em; color: var(--graphite-faint); }
@media (max-width:700px){ .ed-footer-row{ flex-direction:column; text-align:center; } }