@import url("fonts.css");

/* =====================================================================
   NEFERTEM — Warm Egyptian elegance
   Child template of Cassiopeia · British Shorthair cattery, Estonia
   ===================================================================== */

:root {
  /* Warm paper neutrals */
  --nf-ivory:      #f8f2e8;
  --nf-ivory-2:    #fcf8f1;
  --nf-sand:       #efe3d1;
  --nf-sand-line:  #e4d6bf;

  /* Deep warm browns for chrome + ink */
  --nf-espresso:   #221a12;
  --nf-espresso-2: #2c2117;
  --nf-ink:        #33281d;
  --nf-ink-soft:   #6f6050;

  /* Antique Egyptian gold */
  --nf-gold:       #b3842c;
  --nf-gold-2:     #d3a44a;
  --nf-gold-soft:  #ecdcb4;

  --nf-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --nf-sans:  'Mulish', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --nf-shadow-sm: 0 2px 10px rgba(52, 40, 29, .07);
  --nf-shadow:    0 14px 40px -18px rgba(52, 40, 29, .35);
  --nf-radius:    18px;

  /* Override Cassiopeia / Bootstrap tokens */
  --body-bg: var(--nf-ivory);
  --body-color: var(--nf-ink);
  --body-font-family: var(--nf-sans);
  --body-font-size: 1.05rem;
  --body-line-height: 1.7;
  --link-color: var(--nf-gold);
  --link-hover-color: var(--nf-espresso);
  --cassiopeia-color-primary: var(--nf-gold);
  --cassiopeia-color-link: var(--nf-gold);
  --cassiopeia-color-hover: var(--nf-espresso);
  --border-radius: 12px;
  --border-radius-lg: var(--nf-radius);
  --border-color: var(--nf-sand-line);
}

/* ---------- Base ---------- */
html { overflow-x: clip; }
body.site { max-width: 100%; overflow-x: clip; }
body.site {
  background-color: var(--nf-ivory);
  background-image:
    radial-gradient(1200px 600px at 100% -5%, rgba(211,164,74,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 5%, rgba(211,164,74,.07), transparent 55%);
  background-attachment: fixed;
  color: var(--nf-ink);
  font-family: var(--nf-sans);
  font-size: 1.05rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--nf-gold-soft); color: var(--nf-espresso); }

/* Never let media/tables cause horizontal overflow */
img, svg, video, iframe, table { max-width: 100%; }
.com-content-article__body, .item-page { overflow-wrap: break-word; }
.com-content-article__body table, .item-page table { display: block; overflow-x: auto; }

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
  font-family: var(--nf-serif);
  color: var(--nf-espresso);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -.01em;
  font-optical-sizing: auto;
}
h1,.h1 { font-size: clamp(2.1rem, 4vw, 3.1rem); font-weight: 600; }
h2,.h2 { font-size: clamp(1.6rem, 2.8vw, 2.25rem); }
h3,.h3 { font-size: 1.5rem; }

p { margin-bottom: 1.15rem; }
a { text-decoration: none; transition: color .2s ease; }
a:hover { text-decoration: none; }

.container, .grid-child, .site-grid { max-width: 1240px; }
.site-grid { margin-inline: auto; }

/* ---------- Header / chrome — single row: logo left · menu · language right ---------- */
.header.container-header {
  background: linear-gradient(180deg, var(--nf-espresso), var(--nf-espresso-2));
  border-bottom: 3px solid var(--nf-gold);
  box-shadow: 0 8px 30px -18px rgba(0,0,0,.6);
  display: grid;
  grid-template-columns: auto 1fr auto;   /* logo · menu · language */
  align-items: center;
  column-gap: 1.5rem;
  /* full-width bar; inner content constrained + centered to 1240 */
  padding: .35rem max(calc((100% - 1240px) / 2), 1rem);
}
.header.container-header > .grid-child,
.header.container-header > .container-topbar {
  max-width: none; margin: 0; padding: 0; background: none; border: 0;
  grid-row: 1;
}
.header.container-header > .grid-child:not(.container-nav) { grid-column: 1; }   /* brand/logo */
.header.container-header > .container-nav { grid-column: 2; min-width: 0; }       /* menu */
.header.container-header > .container-topbar { grid-column: 3; }                  /* language */

/* sticky header (param stickyHeader=1) */
.header.sticky-top, .sticky-top .header { backdrop-filter: saturate(1.1); }

/* Mobile nav toggle (hamburger) — created by user.js, hidden on desktop */
.nf-nav-toggle { display: none; }

/* Brand / logo (left) */
.navbar-brand { color: #fff; text-align: left; }
.navbar-brand .brand-logo { display: inline-flex; align-items: center; }
.navbar-brand img,
.navbar-brand svg {
  height: 60px; width: auto; max-width: 220px;
  filter: brightness(0) invert(1) drop-shadow(0 2px 8px rgba(0,0,0,.4));
}
.navbar-brand .site-title span,
.navbar-brand > a > span {
  font-family: var(--nf-serif); font-weight: 600; font-size: 1.6rem;
  letter-spacing: .16em; text-transform: uppercase; color: #fff;
}
.navbar-brand .site-description {
  display: block; font-family: var(--nf-sans); font-size:.64rem;
  letter-spacing:.28em; text-transform:uppercase; color: var(--nf-gold-2); margin-top:.3rem;
}

/* ---------- Language switcher (header right) ---------- */
.container-topbar, .container-topbar a { color: var(--nf-gold-soft); }
.container-topbar .grid-child { padding:0; }
.mod-languages { display:flex; gap:.4rem; align-items:center; }
.mod-languages ul { display:flex; gap:.35rem; margin:0; padding:0; list-style:none; }
.mod-languages a, .mod-languages span.active {
  font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap;
  padding:.2rem .55rem; border-radius:999px;
}
.mod-languages a:hover { background: rgba(211,164,74,.18); color:#fff; }
.mod-languages .lang-active,
.mod-languages .lang-active a,
.mod-languages .active a { background: var(--nf-gold) !important; color: var(--nf-espresso) !important; border-radius: 999px; }
.mod-languages img { display:none; } /* hide flags, use text codes */

/* ---------- Main navigation ---------- */
.container-nav { position: relative; }
.container-nav .mod-menu,
ul.mod-menu {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: .15rem .35rem; margin: 0; padding: 0; list-style: none;
}
ul.mod-menu > li > a,
ul.mod-menu > li > span {
  display: block;
  font-family: var(--nf-sans);
  font-weight: 700;
  font-size: .8rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #f3e9d8;
  padding: .55rem .8rem;
  position: relative;
}
ul.mod-menu > li > a::after {
  content: ""; position: absolute; left: .8rem; right: .8rem; bottom: .28rem;
  height: 2px; background: var(--nf-gold-2);
  transform: scaleX(0); transform-origin: left; transition: transform .28s ease;
}
ul.mod-menu > li > a:hover { color: #fff; }
ul.mod-menu > li > a:hover::after,
ul.mod-menu > li.current > a::after,
ul.mod-menu > li.active > a::after { transform: scaleX(1); }
ul.mod-menu > li.current > a,
ul.mod-menu > li.active > a { color: var(--nf-gold-2); }

/* dropdowns */
ul.mod-menu .mod-menu__sub {
  list-style:none; margin:0; padding:.4rem; min-width: 220px;
  background: var(--nf-espresso-2); border:1px solid rgba(211,164,74,.25);
  border-radius: 12px; box-shadow: var(--nf-shadow);
}
ul.mod-menu .mod-menu__sub a { color:#eaddc8; padding:.55rem .8rem; border-radius:8px; font-size:.9rem; letter-spacing:.02em; text-transform:none; font-weight:600; }
ul.mod-menu .mod-menu__sub a:hover { background: rgba(211,164,74,.15); color:#fff; }

/* ---------- HERO (banner position) ---------- */
.container-banner { padding: 0; }
.nf-hero {
  position: relative;
  min-height: min(46vh, 420px);
  display: flex; align-items: center;
  color: #fff;
  background: var(--nf-espresso);
  overflow: hidden;
}
.nf-hero__img {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit: cover; object-position: center 32%;
}
.nf-hero::after {
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(20,15,10,.86) 0%, rgba(20,15,10,.55) 45%, rgba(20,15,10,.15) 100%),
    linear-gradient(0deg, rgba(20,15,10,.55), rgba(20,15,10,0) 45%);
}
.nf-hero__inner {
  position: relative; z-index: 2;
  max-width: 1240px; margin: 0 auto; width: 100%; min-width: 0;
  padding: 4rem clamp(1.2rem, 4vw, 3.5rem);
}
.nf-hero__content { max-width: 620px; }
.nf-hero__eyebrow {
  display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; max-width:100%;
  font-family: var(--nf-sans); font-weight:700;
  font-size:.72rem; letter-spacing:.28em; text-transform:uppercase;
  color: var(--nf-gold-2); margin-bottom: 1.3rem;
}
.nf-hero__eyebrow::before { content:""; width:34px; height:1px; background: var(--nf-gold-2); }
.nf-hero h1, .nf-hero__title {
  font-family: var(--nf-serif); color:#fff; font-weight:500;
  font-size: clamp(2.4rem, 5.2vw, 4.2rem); line-height:1.04; margin:0 0 1.1rem;
  letter-spacing:-.015em; overflow-wrap: break-word;
}
.nf-hero__title em { font-style: italic; color: var(--nf-gold-2); }
.nf-hero__lead { font-size: clamp(1.05rem, 1.7vw, 1.28rem); color: #f0e7d8; max-width: 34em; margin-bottom: 2rem; }
.nf-hero__cta { display:flex; flex-wrap:wrap; gap: .9rem; }

/* ---------- Buttons ---------- */
.btn, .btn-primary, .nf-btn, a.nf-btn {
  font-family: var(--nf-sans); font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; font-size: .8rem;
  border-radius: 999px; padding: .85rem 1.7rem; border: 1.5px solid transparent;
  transition: all .22s ease; cursor: pointer; text-decoration: none; display:inline-block;
}
.btn-primary, .nf-btn--gold, a.nf-btn--gold {
  background: var(--nf-gold); border-color: var(--nf-gold); color: var(--nf-espresso) !important;
  box-shadow: 0 10px 24px -12px rgba(179,132,44,.9);
}
.btn-primary:hover, .nf-btn--gold:hover, a.nf-btn--gold:hover {
  background: var(--nf-gold-2); border-color: var(--nf-gold-2); color: var(--nf-espresso) !important;
  transform: translateY(-2px);
}
.nf-btn--ghost, a.nf-btn--ghost {
  background: transparent; border-color: rgba(255,255,255,.55); color:#fff !important;
}
.nf-btn--ghost:hover, a.nf-btn--ghost:hover { border-color: var(--nf-gold-2); color: var(--nf-gold-2) !important; }
.btn-outline-primary { color: var(--nf-gold); border-color: var(--nf-gold); background:transparent; }
.btn-outline-primary:hover { background: var(--nf-gold); color: var(--nf-espresso); }

/* ---------- Main content ---------- */
.container-main { padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.item-page, .com-content-article {
  background: var(--nf-ivory-2);
  border: 1px solid var(--nf-sand-line);
  border-radius: var(--nf-radius);
  box-shadow: var(--nf-shadow-sm);
  padding: clamp(1.5rem, 4vw, 3.2rem);
}

/* ---------- Category blog -> rounded photo card grid (kittens, breeding) ---------- */
.com-content-category-blog__items,
.com-content-category-blog__items.masonry-3 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.7rem;
  column-count: unset; margin: 0;
}
.com-content-category-blog__item {
  background: var(--nf-ivory-2);
  border: 1px solid var(--nf-sand-line);
  border-radius: var(--nf-radius);
  overflow: hidden;
  box-shadow: var(--nf-shadow-sm);
  transition: transform .25s ease, box-shadow .25s ease;
  display: flex; flex-direction: column; break-inside: avoid; margin: 0;
}
.com-content-category-blog__item:hover { transform: translateY(-6px); box-shadow: var(--nf-shadow); }
.com-content-category-blog__item .item-image,
.com-content-category-blog__item .item-image.left { float: none; margin: 0; width: 100%; }
.com-content-category-blog__item .item-image img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 0; display: block;
}
.com-content-category-blog__item .item-content { padding: 1.15rem 1.35rem 1.5rem; display:flex; flex-direction:column; flex:1; }
.com-content-category-blog__item .page-header { margin: 0 0 .5rem; }
.com-content-category-blog__item .page-header h2 { font-size: 1.3rem; margin: 0; padding: 0; }
.com-content-category-blog__item .page-header h2::after { display: none; }
.com-content-category-blog__item .page-header h2 a { color: var(--nf-espresso); }
.com-content-category-blog__item .page-header h2 a:hover { color: var(--nf-gold); }
@media (max-width: 900px) { .com-content-category-blog__items, .com-content-category-blog__items.masonry-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .com-content-category-blog__items, .com-content-category-blog__items.masonry-3 { grid-template-columns: 1fr; } }
.page-header { margin-bottom: 1.8rem; position: relative; }
.page-header h1, .page-header h2 { position: relative; padding-bottom: .9rem; }
.page-header h1::after, .page-header h2::after {
  content:""; position:absolute; left:0; bottom:0; width:64px; height:3px;
  background: linear-gradient(90deg, var(--nf-gold), var(--nf-gold-2)); border-radius:3px;
}
.item-page img, .blog img, .com-content-article img,
.item-image img, figure img { border-radius: 14px; height: auto; }

/* In-content "Transparent Logo" (white, built for the old dark theme) — retone
   it into a tasteful dark masthead so it reads on the ivory background. */
.com-content-article__body img[src*="Transparent"],
.com-content-article__body img[src*="transparent"],
.item-page img[src*="Transparent"] {
  display: block; margin: 0 auto 1.6rem; max-height: 150px; width: auto;
  border-radius: 0;
  filter: brightness(0) saturate(100%) invert(16%) sepia(20%) saturate(700%) hue-rotate(357deg) brightness(96%) contrast(92%);
  opacity: .9;
}
.item-page p a, .article-content a, .blog a { text-decoration: underline; text-decoration-color: var(--nf-gold-soft); text-underline-offset: 3px; }
.item-page p a:hover { text-decoration-color: var(--nf-gold); }

blockquote {
  border-left: 3px solid var(--nf-gold); background: rgba(211,164,74,.08);
  padding: 1rem 1.4rem; border-radius: 0 12px 12px 0; font-family: var(--nf-serif);
  font-style: italic; font-size: 1.2rem; color: var(--nf-ink);
}

hr { border: 0; border-top: 1px solid var(--nf-sand-line); }

/* ---------- Cards (kittens, breeding cats grids) ---------- */
.card {
  background: var(--nf-ivory-2);
  border: 1px solid var(--nf-sand-line);
  border-radius: var(--nf-radius);
  overflow: hidden;
  box-shadow: var(--nf-shadow-sm);
  transition: transform .25s ease, box-shadow .25s ease;
}
.card:hover { transform: translateY(-5px); box-shadow: var(--nf-shadow); }
.card img, .card-img-top { border-radius: 0; aspect-ratio: 4/3; object-fit: cover; width: 100%; }
.card-body { padding: 1.3rem 1.4rem 1.5rem; }
.card-body h2, .card-body h3, .card-title { font-size: 1.3rem; margin-bottom: .5rem; }

/* Cassiopeia "card" module style */
.card.h-100, .moduletable.card, .mod-list.card { border-radius: var(--nf-radius); }

/* ---------- Forms (contact / ConvertForms) ---------- */
input[type=text], input[type=email], input[type=tel], input[type=url],
input[type=password], input[type=search], input[type=number], textarea, select,
.form-control {
  background: #fff; border: 1.5px solid var(--nf-sand-line); border-radius: 12px;
  padding: .7rem .95rem; color: var(--nf-ink); font-family: var(--nf-sans);
  transition: border-color .2s ease, box-shadow .2s ease; width: 100%; max-width: 100%;
}
input:focus, textarea:focus, select:focus, .form-control:focus {
  outline: none; border-color: var(--nf-gold);
  box-shadow: 0 0 0 4px rgba(211,164,74,.18);
}
label, .control-label { font-weight: 700; color: var(--nf-ink); font-size: .9rem; }

/* ---------- Breadcrumbs ---------- */
.breadcrumb { background: transparent; font-size: .82rem; letter-spacing: .04em; }
.breadcrumb a { color: var(--nf-ink-soft); }
.breadcrumb a:hover { color: var(--nf-gold); }

/* ---------- Footer ---------- */
.container-footer.footer {
  background: linear-gradient(180deg, var(--nf-espresso-2), var(--nf-espresso));
  border-top: 3px solid var(--nf-gold);
  color: #d9ccb6;
  margin-top: 3rem;
}
.container-footer .grid-child { padding-block: 3rem; }
.container-footer a { color: var(--nf-gold-soft); }
.container-footer a:hover { color: #fff; }
.container-footer h1,.container-footer h2,.container-footer h3,
.container-footer h4,.container-footer h5 { color: #fff; }
.container-footer .mod-menu { flex-direction: column; align-items: flex-start; gap: .1rem; }
.container-footer ul.mod-menu > li > a { padding: .4rem 0; text-transform: none; letter-spacing: .01em; font-weight: 600; font-size: .95rem; color:#d9ccb6; }
.container-footer ul.mod-menu > li > a::after { display:none; }
.container-footer ul.mod-menu > li > a:hover { color:#fff; }

/* social list (existing mod_custom in footer) */
.social-list { list-style:none; display:flex; gap:.6rem; padding:0; margin:.6rem 0 0; }
.social-list a {
  display:grid; place-items:center; width:42px; height:42px; border-radius:999px;
  background: rgba(211,164,74,.14); color: var(--nf-gold-soft); font-size:1.05rem;
  transition: all .2s ease;
}
.social-list a:hover { background: var(--nf-gold); color: var(--nf-espresso); transform: translateY(-2px); }

/* ---------- Pagination ---------- */
.pagination .page-link { color: var(--nf-ink); border-radius: 10px !important; border-color: var(--nf-sand-line); margin: 0 2px; }
.pagination .active .page-link, .pagination .page-item.active .page-link { background: var(--nf-gold); border-color: var(--nf-gold); color: var(--nf-espresso); }

/* ---------- Back to top ---------- */
#back-top, .back-to-top-link {
  background: var(--nf-gold) !important; color: var(--nf-espresso) !important;
  border-radius: 999px !important; box-shadow: var(--nf-shadow);
}

/* ---------- Responsive ---------- */
@media (max-width: 767.98px) {
  /* mobile: logo + hamburger on row 1; menu + language collapse below */
  .header.container-header { grid-template-columns: 1fr auto; row-gap: 0; padding-block: .55rem; }
  .header.container-header > .grid-child:not(.container-nav) { grid-column: 1; grid-row: 1; }

  .nf-nav-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    grid-column: 2; grid-row: 1; justify-self: end;
    width: 46px; height: 46px; padding: 0;
    background: transparent; border: 1.5px solid rgba(211,164,74,.5);
    border-radius: 12px; cursor: pointer;
  }
  .nf-nav-toggle:hover { border-color: var(--nf-gold-2); background: rgba(211,164,74,.12); }
  .nf-nav-toggle__bars,
  .nf-nav-toggle__bars::before,
  .nf-nav-toggle__bars::after {
    content: ""; display: block; width: 22px; height: 2px; background: var(--nf-gold-2);
    border-radius: 2px; transition: transform .25s ease, opacity .2s ease, background .2s ease;
  }
  .nf-nav-toggle__bars { position: relative; }
  .nf-nav-toggle__bars::before { position: absolute; left: 0; top: -7px; }
  .nf-nav-toggle__bars::after  { position: absolute; left: 0; top: 7px; }
  .nav-open .nf-nav-toggle__bars { background: transparent; }
  .nav-open .nf-nav-toggle__bars::before { transform: translateY(7px) rotate(45deg); }
  .nav-open .nf-nav-toggle__bars::after  { transform: translateY(-7px) rotate(-45deg); }

  /* collapsible panel */
  .header.container-header > .container-nav    { grid-column: 1 / -1; grid-row: 2; display: none; }
  .header.container-header > .container-topbar { grid-column: 1 / -1; grid-row: 3; display: none; }
  .header.container-header.nav-open > .container-nav { display: block; padding-top: .5rem; }
  .header.container-header.nav-open > .container-topbar {
    display: block; padding: .7rem 0 .2rem; margin-top: .3rem;
    border-top: 1px solid rgba(211,164,74,.18);
  }
  .header.container-header.nav-open > .container-topbar .mod-languages { justify-content: center; }
  .navbar-brand .site-title { font-size: 1.3rem; }
  .navbar-brand img, .navbar-brand svg { height: 46px; }
  .container-nav ul.mod-menu { flex-direction: column; flex-wrap: nowrap; align-items: center; align-content: center; justify-content: flex-start; gap: 0; }
  ul.mod-menu > li { width: 100%; text-align: center; }
  ul.mod-menu > li > a, ul.mod-menu > li > span { display: inline-block; padding: .6rem .6rem; font-size: .82rem; letter-spacing: .08em; }
  ul.mod-menu > li > a::after { display: none; }
  .nf-hero { min-height: min(52vh, 340px); }
  .nf-hero__inner { padding: 2.4rem 1.3rem; }
  .nf-hero__content, .nf-hero__lead, .nf-hero__title, .nf-hero__eyebrow { max-width: 100%; }
  .nf-hero__eyebrow { letter-spacing: .16em; font-size: .66rem; }
  .nf-hero h1, .nf-hero__title { font-size: clamp(1.8rem, 7.6vw, 2.35rem); line-height: 1.08; }
  .nf-hero__lead { font-size: 1rem; }
  .nf-hero__cta { gap: .6rem; }
  .nf-hero__cta .nf-btn { padding: .75rem 1.2rem; font-size: .74rem; }
  .nf-hero::after { background: linear-gradient(0deg, rgba(20,15,10,.9) 0%, rgba(20,15,10,.45) 60%, rgba(20,15,10,.3) 100%); }
}