/*
Theme Name: Krishna Marga — Original Site Recreation
Theme URI: https://krishnamarga.org/
Author: Krishna Marga
Description: Recreation of the 21-page Krishna Marga website, using original supplied artworks. Includes a guided original-content importer.
Version: 1.9.0
License: GPL v2 or later
Text Domain: krishna-marga
*/
:root{--ink:#211b16;--muted:#6e6157;--gold:#b89550;--line:#e9e1d7;--paper:#fffefb;--nav:#170f0b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.75}
a{color:#825d27}a:hover{color:#573c18}img{max-width:100%;height:auto}.site-header{z-index:40;background:var(--nav);color:#fff;width:100%;position:relative}.home .site-header{position:absolute;left:0;top:0;background:transparent}.nav-inner{min-height:75px;display:flex;align-items:center;justify-content:center;padding:8px 28px}.main-nav ul{list-style:none;margin:0;padding:0;display:flex;justify-content:center;align-items:center;gap:30px}.main-nav li{position:relative}.main-nav a{font-family:Arial,Helvetica,sans-serif;text-decoration:none;text-transform:uppercase;letter-spacing:1px;color:white;font-size:14px;display:block;padding:15px 3px;white-space:nowrap;line-height:1.25;text-shadow:0 1px 2px #0009}.main-nav>div>ul>li:first-child>a{font-weight:700}.main-nav li.menu-item-has-children>a::after{content:' ▾';font-size:12px}.main-nav ul ul{position:absolute;z-index:50;top:100%;left:0;min-width:245px;background:#1c1716f5;box-shadow:0 10px 35px #0005;display:none;padding:8px 0;max-height:75vh;overflow-y:auto;gap:0}.main-nav ul ul li{width:100%}.main-nav ul ul a{white-space:normal;text-transform:none;font-size:13px;letter-spacing:.3px;padding:11px 19px}.main-nav ul ul a:hover,.main-nav ul ul a:focus-visible{background:#6b4a2499}.main-nav li:hover>ul,.main-nav li:focus-within>ul{display:block}.menu-toggle{display:none;background:#1e1715bb;color:#fff;border:1px solid #ffffff88;border-radius:4px;font:600 14px Arial,sans-serif;padding:10px 15px}
.home-hero{min-height:calc(100vh - 110px);min-height:calc(100svh - 110px);background-position:center center;background-repeat:no-repeat;background-size:cover;position:relative}.home-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0005 0%,#0000 25%,#0000 100%);pointer-events:none}.home .site-footer{margin:0}.site-footer{background:#000;color:#a7a3a3;min-height:110px;display:flex;align-items:center;padding:20px max(30px,calc((100vw - 1120px)/2));font:14px/1.6 Arial,Helvetica,sans-serif}.site-footer p{margin:0}.site-footer a{color:#ccc}
.page-main{max-width:1130px;padding:48px 25px 90px;margin:0 auto}.page-title{text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:clamp(28px,3vw,36px);line-height:1.25;margin:12px 0 8px;font-weight:400}.title-rule{height:1px;background:var(--line);margin:25px auto 36px;max-width:170px}.page-layout{display:grid;grid-template-columns:minmax(260px,380px) minmax(0,1fr);gap:44px;align-items:start}.page-art{margin:0}.page-art img{display:block;width:100%;height:auto;object-fit:contain;border:0;box-shadow:0 4px 26px #32200a1b}.page-art figcaption{font:12px Arial,sans-serif;color:var(--muted);margin-top:12px}.page-copy{min-width:0;overflow-wrap:break-word}.page-copy p{margin:0 0 1.15em}.page-copy h2,.page-copy h3{font-weight:400;line-height:1.3;margin:1.6em 0 .6em}.page-copy h2{font-size:1.55em}.page-copy h3{font-size:1.3em}.page-copy blockquote{border-left:3px solid var(--gold);padding-left:24px;margin:30px 0;color:#58452f}.page-copy li{margin:.5em 0}.page-copy a{text-decoration:underline}.page-copy .missing-content{font:15px Arial,sans-serif;background:#fff8ee;color:#654f37;padding:16px;border-left:3px solid #c28c45}.page-layout.no-copy{grid-template-columns:minmax(0,680px);justify-content:center}.page-layout.no-copy .page-art{max-width:680px}.skip-link{position:absolute;left:-9999px;top:0;background:#fff;color:#000;z-index:100;padding:10px}.skip-link:focus{left:0}
@media(max-width:850px){.nav-inner{justify-content:space-between;flex-wrap:wrap;min-height:65px;padding:9px 18px}.menu-toggle{display:block}.main-nav{display:none;width:100%;background:#19120fee}.main-nav.is-open{display:block}.main-nav ul{display:block;width:100%;padding:5px 5px 12px}.main-nav li{display:block}.main-nav a{padding:11px 12px;font-size:13px}.main-nav ul ul{position:static;max-height:none;display:block;box-shadow:none;background:transparent;padding:0 0 6px 13px}.main-nav ul ul a{color:#eee;font-size:12px;padding:8px 16px}.home-hero{min-height:74svh;background-position:63% center}.page-layout{grid-template-columns:1fr;gap:30px}.page-art{max-width:540px;margin:0 auto}.page-main{padding:40px 20px 65px}.site-footer{padding:27px 20px;text-align:center;justify-content:center}.home .site-header{background:#0005}.home .main-nav{background:#130d0ceb}}
@media(min-width:851px){.page-layout.image-right{grid-template-columns:minmax(0,1fr) minmax(260px,380px)}.page-layout.image-right .page-art{order:2}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Version 1.1: place original illustrations on the RIGHT on wider screens.
   Narrow screens remain one column with the artwork below the heading. */
@media (min-width:851px) {
  .page-layout.image-right:not(.no-copy) {
    grid-template-columns: minmax(0,1fr) minmax(260px,380px);
  }
  .page-layout.image-right:not(.no-copy) .page-copy { order:1; }
  .page-layout.image-right:not(.no-copy) .page-art { order:2; }
}

/* v1.4 -- per-page design controls (defaults preserve the previous theme). */
.km-easy-page.km-bg-ivory{background:#fff8e9;padding:22px 24px;border-radius:3px}
.km-easy-page.km-bg-soft-gray{background:#eeeff0;padding:22px 24px;border-radius:3px}
.km-easy-page.km-bg-charcoal{background:#252321;color:#f5f0e7;padding:22px 24px;border-radius:3px}
.km-easy-page.km-bg-charcoal a{color:#ead0a0}
.km-easy-page.km-bg-charcoal .title-rule{background:#615d57}
.km-easy-page.km-bg-charcoal .page-copy blockquote{color:#e6dfd4}
.km-easy-page.km-align-left .page-copy{text-align:left}
.km-easy-page.km-align-center .page-copy{text-align:center}
.km-easy-page.km-align-right .page-copy{text-align:right}
.km-easy-page.km-custom-title-size .page-title{font-size:var(--km-title-size)}
.km-easy-page.km-custom-body-size .page-copy{font-size:var(--km-body-size)}
.km-easy-page .km-page-headline{font-size:1.15em;font-weight:600;margin:0 0 1.1em}
.km-easy-page .page-layout.text-only{grid-template-columns:minmax(0,1fr)}
.km-easy-page .page-layout.image-above{grid-template-columns:minmax(0,1fr)}
.km-easy-page .page-layout.image-above .page-art{order:0;max-width:620px;width:100%;margin:0 auto 22px}
.km-easy-page .page-layout.image-above .page-copy{order:1}
@media(min-width:851px){
 .km-easy-page .page-layout.image-left:not(.no-copy){grid-template-columns:minmax(260px,380px) minmax(0,1fr)}
 .km-easy-page .page-layout.image-left:not(.no-copy) .page-art{order:0}
 .km-easy-page .page-layout.image-left:not(.no-copy) .page-copy{order:1}
}
@media(max-width:850px){
 .km-easy-page .page-layout.image-left,.km-easy-page .page-layout.image-right,.km-easy-page .page-layout.image-above{grid-template-columns:1fr}
 .km-easy-page .page-layout.image-left .page-art,.km-easy-page .page-layout.image-right .page-art{order:0}
 .km-easy-page .page-layout.image-left .page-copy,.km-easy-page .page-layout.image-right .page-copy{order:1}
}

/* Version 1.5: show the COMPLETE original Vrindavan illustration.
   The previous background-size:cover on a viewport-height container cropped
   Krishna's peacock-feather crown. A real responsive image preserves its
   natural 3:2 aspect ratio, shows the whole supplied artwork at any width,
   and leaves the image text-free for screen readers. */
.home-hero {
  min-height: 0;
  background: transparent;
  width: 100%;
  height: auto;
  overflow: visible;
}
.home-hero .home-hero-image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center top;
}
@media (max-width:850px) {
  .home-hero { min-height: 0; }
}

/* v1.9: responsive WebP <picture> keeps original aspect ratios in every layout. */
.home-hero picture { display:block; width:100%; height:auto; }
.page-art picture { display:block; width:100%; height:auto; }