* { box-sizing: border-box; margin: 0; padding: 0; }     html { scroll-behavior: smooth; }     body {       font-family: 'Lora', serif;       background: #FBF6EF;       color: #2C1A0E;       overflow-x: hidden;     }      /* ─── HERO ─────────────────────────────────────────────────── */     .hero {       position: relative;       height: 100vh;       display: flex;       align-items: center;       justify-content: center;       overflow: hidden;       background: #1a1008;     }     .hero-bg {       position: absolute;       inset: 0;       background-image: url('https://www.yudronwangmo.com/wp-content/uploads/2026/06/IMG_5591-scaled.jpeg');       background-size: cover;       background-position: center;       will-change: transform;     }     .hero-overlay {       position: absolute;       inset: 0;       background: linear-gradient(         to bottom,         rgba(20, 10, 4, 0.40) 0%,         rgba(20, 10, 4, 0.30) 50%,         rgba(20, 10, 4, 0.62) 100%       );     }     .hero-shapes-back, .hero-shapes-mid {       position: absolute;       inset: 0;       pointer-events: none;     }     .shape { position: absolute; }     .shape-circle-1 {       width: 320px; height: 320px;       border-radius: 50%;       border: 1px solid rgba(196, 146, 42, 0.14);       top: 8%; right: 7%;     }     .shape-circle-2 {       width: 110px; height: 110px;       border-radius: 50%;       background: rgba(196, 146, 42, 0.07);       bottom: 22%; left: 7%;     }     .shape-diamond {       width: 58px; height: 58px;       background: rgba(255, 200, 100, 0.13);       transform: rotate(45deg);       top: 62%; right: 14%;     }     .shape-dot {       width: 8px; height: 8px;       border-radius: 50%;       background: rgba(196, 146, 42, 0.65);       top: 28%; left: 9%;     }      .hero-content {       position: relative;       z-index: 2;       text-align: center;       max-width: 820px;       padding: 0 24px;     }     .hero-eyebrow {       font-family: 'Inter', sans-serif;       font-size: 12px;       font-weight: 600;       letter-spacing: 0.18em;       text-transform: uppercase;       color: rgba(230, 190, 120, 0.88);       margin-bottom: 20px;     }     .hero-title {       font-family: 'Playfair Display', serif;       font-size: clamp(54px, 9vw, 94px);       font-weight: 700;       color: #FDF8F0;       line-height: 1.05;       margin-bottom: 24px;       text-shadow: 0 2px 24px rgba(0,0,0,0.28);     }     .hero-subtitle {       font-family: 'Lora', serif;       font-size: clamp(15px, 2.1vw, 19px);       line-height: 1.75;       color: rgba(253, 248, 240, 0.86);       max-width: 650px;       margin: 0 auto 38px;       text-wrap: pretty;     }     .hero-subtitle em { font-style: italic; }      .btn-primary {       display: inline-block;       background: #C4922A;       color: #FDF8F0;       padding: 16px 44px;       border-radius: 4px;       font-family: 'Inter', sans-serif;       font-weight: 600;       font-size: 16px;       letter-spacing: 0.03em;       border: none;       cursor: pointer;       text-decoration: none;       transition: background 0.2s, transform 0.15s, box-shadow 0.2s;       box-shadow: 0 4px 22px rgba(196, 146, 42, 0.32);     }     .btn-primary:hover {       background: #B5831F;       transform: translateY(-2px);       box-shadow: 0 8px 30px rgba(196, 146, 42, 0.42);     }      .scroll-indicator {       position: absolute;       bottom: 30px;       left: 50%;       transform: translateX(-50%);       cursor: pointer;       opacity: 0;     }      /* ─── NAV ────────────────────────────────────────────────── */     .site-nav {       position: absolute;       top: 0; left: 0; right: 0;       z-index: 10;       display: flex;       justify-content: space-between;       align-items: center;       padding: 28px 48px;     }     .nav-logo {       font-family: 'Playfair Display', serif;       font-size: 20px;       color: rgba(253,248,240,0.92);       text-decoration: none;     }     .nav-links {       display: flex;       gap: 36px;       list-style: none;     }     .nav-links a {       font-family: 'Inter', sans-serif;       font-size: 13px;       font-weight: 500;       color: rgba(253,248,240,0.78);       text-decoration: none;       letter-spacing: 0.06em;       text-transform: uppercase;       transition: color 0.2s;     }     .nav-links a:hover { color: #E6BE78; }      /* ─── BOOKS SECTION ──────────────────────────────────────── */     .books-section {       padding: 110px 24px;       background: #FBF6EF;     }     .section-label {       font-family: 'Inter', sans-serif;       font-size: 12px;       font-weight: 600;       letter-spacing: 0.18em;       text-transform: uppercase;       color: #C4922A;       text-align: center;       margin-bottom: 14px;     }     .section-headline {       font-family: 'Playfair Display', serif;       font-size: clamp(32px, 5vw, 50px);       font-weight: 700;       color: #2C1A0E;       text-align: center;       margin-bottom: 16px;       line-height: 1.15;     }     .section-subtext {       font-family: 'Lora', serif;       font-style: italic;       font-size: 16px;       color: rgba(44, 26, 14, 0.58);       text-align: center;       max-width: 520px;       margin: 0 auto 68px;       line-height: 1.7;     }      .books-grid {       display: grid;       grid-template-columns: repeat(2, 1fr);       gap: 32px;       max-width: 980px;       margin: 0 auto;     }     .book-card {       display: flex;       gap: 24px;       align-items: flex-start;       background: rgba(196, 146, 42, 0.045);       border: 1px solid rgba(196, 146, 42, 0.16);       border-radius: 12px;       padding: 30px 26px;       transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;       cursor: default;     }     .book-card:hover {       transform: translateY(-6px);       box-shadow: 0 16px 50px rgba(44, 26, 14, 0.11);       border-color: rgba(196, 146, 42, 0.33);     }     .book-cover {       width: 90px;       height: 130px;       flex-shrink: 0;       border-radius: 3px;       box-shadow: 4px 6px 18px rgba(44, 26, 14, 0.22);       object-fit: contain;       object-position: center;       background: #f5f0e6;     }     .book-info { flex: 1; }     .book-tag {       font-family: 'Inter', sans-serif;       font-size: 10.5px;       font-weight: 600;       letter-spacing: 0.12em;       text-transform: uppercase;       color: #C4922A;       margin-bottom: 7px;     }     .book-title {       font-family: 'Playfair Display', serif;       font-size: 17px;       font-weight: 600;       color: #2C1A0E;       line-height: 1.3;       margin-bottom: 10px;     }     .book-desc {       font-family: 'Lora', serif;       font-size: 13.5px;       line-height: 1.7;       color: rgba(44, 26, 14, 0.68);       margin-bottom: 14px;     }     .book-link {       font-family: 'Inter', sans-serif;       font-size: 12.5px;       font-weight: 600;       color: #C4922A;       text-decoration: none;       letter-spacing: 0.04em;       border-bottom: 1px solid rgba(196, 146, 42, 0.28);       padding-bottom: 2px;       transition: border-color 0.2s, color 0.2s;     }     .book-link:hover { color: #B5831F; border-color: #B5831F; }      .award-badge {       display: inline-flex;       align-items: center;       gap: 5px;       font-family: 'Inter', sans-serif;       font-size: 10.5px;       font-weight: 600;       color: #B5831F;       background: rgba(196, 146, 42, 0.09);       border: 1px solid rgba(196, 146, 42, 0.22);       border-radius: 20px;       padding: 3px 10px;       margin-bottom: 7px;     }      .forthcoming-card {       grid-column: 1 / -1;       background: linear-gradient(135deg, rgba(196,146,42,0.07), rgba(90,122,90,0.05));       border: 1px solid rgba(196,146,42,0.22);     }     .forthcoming-label {       font-family: 'Inter', sans-serif;       font-size: 10.5px;       font-weight: 700;       letter-spacing: 0.14em;       text-transform: uppercase;       color: #5A7A5A;       margin-bottom: 7px;     }      /* ─── ABOUT SECTION ──────────────────────────────────────── */     .about-section {       position: relative;       overflow: hidden;     }     .about-photo-bg {       position: absolute;       inset: 0;       background-image: url('https://www.yudronwangmo.com/wp-content/uploads/2026/06/IMG_7189-scaled.jpeg');       background-size: cover;       background-position: center 35%;     }     .about-overlay {       position: absolute;       inset: 0;       background: linear-gradient(         to right,         rgba(251,246,239,0.97) 0%,         rgba(251,246,239,0.93) 50%,         rgba(251,246,239,0.38) 100%       );     }     .about-inner {       position: relative;       z-index: 2;       max-width: 1060px;       margin: 0 auto;       padding: 100px 48px;       display: grid;       grid-template-columns: 280px 1fr;       gap: 64px;       align-items: center;     }     .author-photo-col {       display: flex;       flex-direction: column;       align-items: center;       gap: 18px;     }     .author-photo {       width: 230px;       height: 285px;       object-fit: cover;       object-position: center top;       border-radius: 8px;       box-shadow: 8px 12px 42px rgba(44,26,14,0.22);       display: block;       filter: saturate(0.78) hue-rotate(8deg) brightness(1.03);     }     .author-photo-formal {       width: 155px;       height: 192px;       object-fit: cover;       object-position: center top;       border-radius: 6px;       box-shadow: 5px 8px 26px rgba(44,26,14,0.18);       display: block;       filter: saturate(0.78) hue-rotate(8deg) brightness(1.06);     }     .about-text-col .section-label { text-align: left; }     .about-text-col .section-headline {       text-align: left;       font-size: clamp(26px, 3.5vw, 40px);       margin-bottom: 22px;     }     .about-body {       font-family: 'Lora', serif;       font-size: 16px;       line-height: 1.82;       color: rgba(44,26,14,0.78);       margin-bottom: 18px;     }     .about-body:last-of-type { margin-bottom: 32px; }      /* ─── SUBSTACK CTA ───────────────────────────────────────── */     .substack-section {       padding: 108px 24px;       background: #2C1A0E;       background-image: url('https://www.yudronwangmo.com/wp-content/uploads/2026/06/DAEBDA06-D555-46F2-BC21-03E61499EE7B-scaled.jpeg');       background-size: cover;       background-position: center 25%;       text-align: center;       position: relative;       overflow: hidden;     }     .substack-section::before {       content: '';       position: absolute;       inset: 0;       background: rgba(20, 10, 4, 0.52);       z-index: 1;     }     .substack-glow, .substack-content { z-index: 2; position: relative; }     .substack-glow {       position: absolute;       top: 50%; left: 50%;       transform: translate(-50%, -50%);       width: 640px; height: 280px;       background: radial-gradient(ellipse, rgba(196,146,42,0.14), transparent 70%);       pointer-events: none;     }     .substack-content {       position: relative;       z-index: 2;       max-width: 620px;       margin: 0 auto;     }     .substack-section .section-label { color: #E6BE78; }     .substack-section .section-headline {       color: #FDF8F0;       font-size: clamp(30px, 5vw, 50px);       margin-bottom: 20px;     }     .substack-body {       font-family: 'Lora', serif;       font-size: 17px;       line-height: 1.8;       color: rgba(253,248,240,0.72);       margin-bottom: 38px;       text-wrap: pretty;     }     .btn-outline {       display: inline-block;       background: transparent;       color: #E6BE78;       padding: 15px 42px;       border-radius: 4px;       font-family: 'Inter', sans-serif;       font-weight: 600;       font-size: 15px;       letter-spacing: 0.03em;       border: 1.5px solid rgba(196,146,42,0.48);       cursor: pointer;       text-decoration: none;       transition: all 0.2s ease;     }     .btn-outline:hover {       background: rgba(196,146,42,0.11);       border-color: #E6BE78;       transform: translateY(-2px);     }      /* ─── FOOTER ─────────────────────────────────────────────── */     .site-footer {       background: #180C04;       padding: 38px 48px;       display: flex;       justify-content: space-between;       align-items: center;       flex-wrap: wrap;       gap: 16px;     }     .footer-logo {       font-family: 'Playfair Display', serif;       font-size: 18px;       color: rgba(253,248,240,0.65);     }     .footer-direct-buy {       font-family: 'Lora', serif;       font-size: 13px;       font-style: italic;       color: rgba(253,248,240,0.44);       max-width: 400px;       text-align: center;       line-height: 1.65;     }     .footer-links {       display: flex;       gap: 24px;       list-style: none;     }     .footer-links a {       font-family: 'Inter', sans-serif;       font-size: 13px;       color: rgba(253,248,240,0.48);       text-decoration: none;       transition: color 0.2s;     }     .footer-links a:hover { color: #E6BE78; }      /* ─── KEYFRAMES ──────────────────────────────────────────── */     @keyframes floatA {       0%, 100% { transform: translateY(0px) rotate(0deg); }       50%       { transform: translateY(-16px) rotate(4deg); }     }     @keyframes floatB {       0%, 100% { transform: translateY(0px); }       50%       { transform: translateY(-11px); }     }     @keyframes floatC {       0%, 100% { transform: translateY(0px) rotate(45deg); }       50%       { transform: translateY(-9px) rotate(50deg); }     }     .float-a { animation: floatA 8s ease-in-out infinite; }     .float-b { animation: floatB 11s ease-in-out infinite 2s; }     .float-c { animation: floatC 7s ease-in-out infinite 1s; }      @keyframes bounce {       0%, 100% { transform: translateX(-50%) translateY(0); opacity: 0.55; }       50%       { transform: translateX(-50%) translateY(8px); opacity: 1; }     }     .scroll-indicator { animation: bounce 2.2s ease-in-out infinite; }      /* ─── RESPONSIVE ─────────────────────────────────────────── */     @media (max-width: 860px) {       .books-grid { grid-template-columns: 1fr; }       .forthcoming-card { grid-column: auto; }       .about-inner { grid-template-columns: 1fr; padding: 80px 24px; gap: 36px; }       .about-overlay { background: rgba(251,246,239,0.94); }       .author-photo { width: 160px; height: 198px; }       .author-photo-formal { width: 110px; height: 136px; }       .author-photo-col { align-items: center; }       .site-nav { padding: 20px 24px; }       .nav-links { display: none; }       .site-footer { flex-direction: column; text-align: center; }       .footer-direct-buy { max-width: 100%; }     }     .hardback-section{padding:100px 24px;background:#143330;text-align:center;position:relative;overflow:hidden} .hardback-section .section-label{color:#E6BE78}.hardback-section .section-headline{color:#FDF8F0} .hardback-sub{font-family:'Lora',serif;font-style:italic;font-size:17px;color:rgba(253,248,240,.78);max-width:600px;margin:0 auto 56px;line-height:1.7} .hardback-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:48px;max-width:900px;margin:0 auto} .hardback-item img{width:100%;max-width:340px;border-radius:8px;box-shadow:0 22px 55px rgba(0,0,0,.38);transition:transform .5s ease} .hardback-item img:hover{transform:translateY(-6px) rotate(-1deg)} .hardback-item h3{font-family:'Playfair Display',serif;font-style:italic;color:#FDF8F0;font-size:21px;margin:24px 0 6px} .hardback-price{font-family:'Inter',sans-serif;color:#E6BE78;font-size:15px;margin-bottom:18px} .publisher{display:flex;align-items:center;justify-content:center;gap:20px;margin:70px auto 0;max-width:620px} .publisher img{width:90px;height:90px;opacity:.85;flex-shrink:0} .publisher p{font-family:'Lora',serif;font-style:italic;color:rgba(44,26,14,.65);font-size:15px;line-height:1.65;text-align:left} .book-title em,.book-desc em,.substack-body em{font-style:italic} .book-desc a{color:#C4922A;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(196,146,42,.35)} .alsoby-section{padding:90px 24px;background:#F3EADB} .yt-line{margin-top:46px;padding-top:38px;border-top:1px solid rgba(230,190,120,.28)} .yt-line h3{font-family:'Playfair Display',serif;color:#FDF8F0;font-size:26px;margin-bottom:12px} .site-footer .aol{display:flex;align-items:center;gap:12px} .site-footer .aol img{width:46px;height:46px;filter:invert(1);opacity:.55} @media (max-width:860px){.hardback-grid{grid-template-columns:1fr}.publisher{flex-direction:column}.publisher p{text-align:center}}#sp-sns05u,#sp-za8tq2,#sp-nhe8ju,#sp-d374mw{max-width:100%!important;width:100%!important;padding:0!important;margin:0!important}.hardback-section{padding:44px 24px!important}.hardback-sub{margin-bottom:26px!important}.hardback-grid{gap:28px!important;max-width:640px!important}.hardback-item img{max-width:170px!important}.hardback-item h3{margin:14px 0 4px!important;font-size:18px!important}.hardback-price{margin-bottom:12px!important}.hardback-section .section-headline{margin-bottom:8px!important}#books{padding-bottom:48px!important}.publisher{margin:30px auto 0!important}#books .forthcoming-card{grid-column:auto!important}#books .book-link{font-size:15px!important;font-weight:700!important;color:#8B2E3C!important;border-bottom-color:rgba(139,46,60,.35)!important}#books .book-link:hover{color:#6E2230!important}#books img[alt^="Clearing the Way to Awakening Companion Workbook"]{width:118px!important;height:auto!important;object-fit:initial!important;background:none!important}#sp-sns05u{max-width: 100%; padding: 0px;}#sp-za8tq2{padding: 0px;}#sp-nhe8ju{width: calc(100% - 0px); padding: 0px;}#sp-d374mw{margin: 0px;}