:root{
  --night:#111827;
  --dusk:#1E2B44;
  --mist:#445A78;
  --coral:#E98B6C;
  --gold:#F4C56E;
  --cream:#F7EED7;
  --paper:#F3EEE2;
  --meadow:#8FAE7A;
  --sage:#A8BE97;
  --stone:#CFC7B8;
  --ink:#2A2E2A;
  --body:#4C4A45;
  --foundation:#C86B46;
  --education:#6F8F7A;
  --display:'Cormorant Garamond',serif;
  --copy:'Cormorant Garamond',serif;
  --ui:'Raleway',sans-serif;
  --nav-h:72px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--copy);
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
img{max-width:100%;display:block}

/* ---------- TOP BAR ---------- */
.topbar{
  position:fixed;inset:0 0 auto 0;
  height:var(--nav-h);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 24px;
  z-index:1000;
  color:rgba(247,238,215,.94);
  background:linear-gradient(to bottom,rgba(7,18,31,.82),rgba(7,18,31,.38),rgba(7,18,31,0));
  transition:background .35s ease, backdrop-filter .35s ease;
}
.topbar.scrolled{
  background:rgba(9,20,35,.72);
  backdrop-filter:blur(14px);
}
.brand{
  font:500 10px/1 var(--ui);
  text-transform:uppercase;
  letter-spacing:.32em;
  white-space:nowrap;
}
.brand-mark{
  display:block;
  text-align:center;
  font-size:20px;
  line-height:1;
  margin-bottom:7px;
  opacity:.92;
}
.menu-toggle{
  width:42px;height:42px;padding:8px;background:none;border:0;cursor:pointer;
  justify-self:start;
}
.menu-toggle span{
  display:block;height:1px;background:rgba(247,238,215,.94);margin:6px 0;
}
.menu-toggle span:nth-child(2){width:68%}
.menu-spacer{width:42px;justify-self:end}

.drawer{
  position:fixed;inset:0 auto 0 0;
  width:min(370px,88vw);
  z-index:1100;
  padding:95px 34px 34px;
  transform:translateX(-104%);
  transition:transform .42s cubic-bezier(.22,.72,.24,1);
  background:rgba(8,18,31,.96);
  backdrop-filter:blur(18px);
  color:var(--cream);
  box-shadow:20px 0 70px rgba(0,0,0,.24);
}
.drawer.open{transform:translateX(0)}
.drawer-close{
  position:absolute;top:18px;left:24px;
  border:0;background:none;color:var(--cream);font-size:30px;cursor:pointer;
}
.drawer a{
  display:block;
  padding:15px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
  font:400 24px/1.25 var(--display);
}
.drawer-note{
  margin-top:30px;
  color:rgba(247,238,215,.55);
  font:400 9px/1.6 var(--ui);
  text-transform:uppercase;
  letter-spacing:.19em;
}

/* ---------- HEROES ---------- */
.panel{
  position:relative;
  min-height:100svh;
  isolation:isolate;
  overflow:hidden;
  background:var(--night);
}
.panel.light-overlay::after,
.panel.dark-overlay::after{
  content:"";
  position:absolute;inset:0;
  z-index:1;pointer-events:none;
}
.panel.dark-overlay::after{
  background:
    linear-gradient(to bottom, rgba(8,17,30,.42) 0%, rgba(8,17,30,.12) 18%, rgba(8,17,30,0) 40%),
    linear-gradient(to top, rgba(8,17,30,.62) 0%, rgba(8,17,30,.18) 22%, rgba(8,17,30,0) 42%);
}
.panel.light-overlay::after{
  background:
    linear-gradient(to bottom, rgba(248,243,233,.08) 0%, rgba(248,243,233,0) 16%),
    linear-gradient(to top, rgba(8,17,30,.34) 0%, rgba(8,17,30,.05) 20%, rgba(8,17,30,0) 36%);
}
.bg-wrap{
  position:absolute;inset:0;
}
.bg-wrap img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
}
.panel-content{
  position:relative;
  z-index:2;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:calc(var(--nav-h) + 36px) 24px 94px;
}
.hero-home .panel-content{justify-content:flex-start;padding-top:13vh}
.panel-content.left{
  align-items:flex-start;
  text-align:left;
  width:min(1200px,100%);
  margin:0 auto;
}
.panel-copy{
  max-width:760px;
}
.kicker{
  margin:0 0 15px;
  font:400 10px/1.2 var(--ui);
  text-transform:uppercase;
  letter-spacing:.28em;
  opacity:.92;
}
.kicker.dark{color:rgba(247,238,215,.86)}
.kicker.light{color:rgba(42,46,42,.72)}
.home-title{
  margin:0;
  font-family:var(--display);
  font-weight:400;
  line-height:.96;
  letter-spacing:.006em;
  color:var(--cream);
  text-shadow:0 2px 24px rgba(0,0,0,.24), 0 0 1px rgba(255,255,255,.18);
}
.home-title .line-capital,
.home-title .line-conscience{
  display:block;
}
.home-title .line-capital{
  font-size:clamp(58px,8.7vw,118px);
  opacity:0;
  filter:blur(6px);
  transform:translateY(8px);
  animation:revealMain 1.55s cubic-bezier(.22,.78,.2,1) .35s forwards;
}
.home-title .line-conscience{
  margin-top:.10em;
  font-size:clamp(50px,7.7vw,104px);
  opacity:0;
  filter:blur(6px);
  transform:translateY(10px);
  animation:revealMain 1.9s cubic-bezier(.18,.82,.2,1) 1.35s forwards;
}
.hero-sub{
  max-width:650px;
  margin:26px auto 0;
  color:rgba(247,238,215,.95);
  font-size:clamp(23px,2.22vw,33px);
  line-height:1.4;
  font-style:italic;
  font-weight:400;
  letter-spacing:.004em;
  text-shadow:0 2px 16px rgba(0,0,0,.22);
  opacity:0;
  animation:fadeUp 1.2s ease 2.45s forwards;
}
.hero-actions{
  margin-top:28px;
  opacity:0;
  animation:fadeUp 1.2s ease 2.95s forwards;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:138px;
  height:48px;
  padding:0 24px;
  border-radius:999px;
  border:1px solid rgba(247,238,215,.70);
  background:rgba(15,24,36,.16);
  color:var(--cream);
  box-shadow:0 8px 28px rgba(0,0,0,.14);
  font:500 10px/1 var(--ui);
  text-transform:uppercase;
  letter-spacing:.24em;
  transition:transform .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.btn:hover{
  background:rgba(247,238,215,.16);
  border-color:rgba(247,238,215,.95);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  transform:translateY(-1px);
}
.scroll-cue{
  position:absolute;z-index:3;
  left:50%;bottom:24px;transform:translateX(-50%);
  display:grid;place-items:center;
  width:42px;height:42px;border-radius:50%;
  border:1px solid rgba(247,238,215,.38);
  color:rgba(247,238,215,.8);
  font-size:18px;
  animation:floatCue 2.8s ease-in-out infinite;
}

/* ---------- SECTION TRANSITIONS ---------- */
.mist-separator{
  position:relative;
  height:140px;
  margin-top:-2px;
  background:
    radial-gradient(ellipse at 22% 48%, rgba(255,255,255,.86), transparent 40%),
    radial-gradient(ellipse at 76% 44%, rgba(255,255,255,.76), transparent 42%),
    linear-gradient(to bottom, rgba(246,239,224,.04), rgba(246,239,224,.98));
  overflow:hidden;
}
.mist-separator::before,
.mist-separator::after{
  content:"";
  position:absolute;
  width:60vw;height:74px;border-radius:50%;
  background:rgba(255,255,255,.52);
  filter:blur(18px);
  animation:mistDrift 16s ease-in-out infinite alternate;
}
.mist-separator::before{left:-8vw;top:28px}
.mist-separator::after{right:-9vw;top:54px;animation-delay:-7s}

/* ---------- SHARED CONTENT SECTIONS ---------- */
.section-hero .panel-content{
  justify-content:flex-start;
  padding-top:18vh;
}
.section-hero .title{
  margin:0;
  max-width:680px;
  color:var(--cream);
  font-family:var(--display);
  font-weight:400;
  line-height:.98;
  letter-spacing:.004em;
  font-size:clamp(42px,7vw,92px);
  text-shadow:0 2px 22px rgba(0,0,0,.10);
}
.section-hero .strap{
  max-width:590px;
  margin:18px 0 0;
  color:rgba(247,238,215,.88);
  font-size:clamp(24px,2.3vw,34px);
  line-height:1.3;
}
.section-hero .summary{
  max-width:520px;
  margin:18px 0 0;
  color:rgba(247,238,215,.82);
  font-size:clamp(21px,1.9vw,28px);
  line-height:1.45;
}
.section-hero .actions{margin-top:26px}
.section-hero .btn{
  border-radius:999px;
}
.section-hero.foundation .btn{border-color:rgba(244,197,110,.62)}
.section-hero.education .btn{border-color:rgba(244,197,110,.62)}

/* ---------- FOUNDATION CLARITY REFINEMENT ---------- */



/* ---------- CONTROLLED READABILITY REFINEMENT ---------- */
.section-hero.foundation::before,.section-hero.education::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none}
.section-hero.foundation::before{background:radial-gradient(ellipse 92% 86% at 17% 30%,rgba(8,17,28,.50) 0%,rgba(8,17,28,.44) 16%,rgba(8,17,28,.34) 30%,rgba(8,17,28,.23) 44%,rgba(8,17,28,.13) 58%,rgba(8,17,28,.06) 72%,rgba(8,17,28,.02) 86%,rgba(8,17,28,0) 100%)}
.section-hero.education::before{background:radial-gradient(ellipse 92% 86% at 18% 28%,rgba(8,17,28,.38) 0%,rgba(8,17,28,.33) 16%,rgba(8,17,28,.26) 30%,rgba(8,17,28,.18) 44%,rgba(8,17,28,.10) 58%,rgba(8,17,28,.05) 72%,rgba(8,17,28,.015) 86%,rgba(8,17,28,0) 100%)}
.section-hero.foundation .panel-content,.section-hero.education .panel-content{padding-top:14vh;padding-left:min(7vw,82px)}
.section-hero.foundation .panel-copy,.section-hero.education .panel-copy{max-width:500px}
.section-hero.foundation .kicker,.section-hero.education .kicker{font-size:13px;font-weight:500;letter-spacing:.23em;color:rgba(247,238,215,.98);text-shadow:0 2px 12px rgba(0,0,0,.25)}
.section-hero.foundation .title,.section-hero.education .title{max-width:480px;text-shadow:0 3px 20px rgba(0,0,0,.30)}
.section-hero.foundation .strap,.section-hero.education .strap{max-width:455px;color:rgba(247,238,215,.98);text-shadow:0 2px 16px rgba(0,0,0,.28)}
.section-hero.foundation .summary,.section-hero.education .summary{max-width:445px;color:rgba(247,238,215,.96);text-shadow:0 2px 15px rgba(0,0,0,.26)}
.section-hero.foundation .btn,.section-hero.education .btn{background:rgba(13,22,34,.17);border-color:rgba(244,197,110,.80)}
.mist-separator{height:180px;margin-top:-36px;margin-bottom:-36px;z-index:5;background:radial-gradient(ellipse at 12% 52%,rgba(255,255,255,.98),transparent 39%),radial-gradient(ellipse at 46% 44%,rgba(255,255,255,.84),transparent 41%),radial-gradient(ellipse at 83% 54%,rgba(255,255,255,.96),transparent 39%),linear-gradient(to bottom,rgba(246,239,224,0),rgba(246,239,224,.82) 46%,rgba(246,239,224,0))}
.mist-separator::before,.mist-separator::after{width:68vw;height:94px;background:rgba(255,255,255,.56);filter:blur(26px);animation-duration:22s}

/* ---------- ABOUT / JOURNAL / CONTACT ---------- */
.editorial{
  background:var(--paper);
}
.block{
  width:min(1180px, calc(100% - 40px));
  margin:0 auto;
}
.about{
  padding:90px 0 80px;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:7vw;
}
.about h2,.journal h2,.contact h2{
  margin:12px 0 18px;
  font:400 clamp(38px,4.8vw,64px)/1.12 var(--display);
}
.about p{
  margin:0 0 18px;
  font-size:clamp(22px,2vw,28px);
  line-height:1.5;
  color:var(--body);
}
.text-link{
  display:inline-flex;gap:10px;align-items:center;
  border-bottom:1px solid currentColor;
  padding-bottom:7px;
  font:400 10px/1 var(--ui);
  text-transform:uppercase;
  letter-spacing:.20em;
}
.text-link span{transition:transform .25s ease}
.text-link:hover span{transform:translateX(4px)}

.journal{
  padding:12px 0 90px;
  border-top:1px solid rgba(42,46,42,.08);
}
.journal-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin-top:34px;
}
.card{
  padding:28px;
  min-height:250px;
  border-top:1px solid rgba(42,46,42,.24);
  background:rgba(255,255,255,.32);
}
.card small{
  display:block;
  color:#6E7067;
  font:400 10px/1.2 var(--ui);
  text-transform:uppercase;
  letter-spacing:.18em;
}
.card h3{
  margin:18px 0 12px;
  font:400 28px/1.25 var(--display);
}
.card p{
  margin:0;
  font-size:20px;
  line-height:1.45;
  color:#63615C;
}

.contact{
  padding:90px 0 110px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 0%, rgba(244,197,110,.18), transparent 28%),
    linear-gradient(to bottom, #F3EEE2, #E5EADC);
}
.contact p{
  width:min(700px,100%);
  margin:0 auto 26px;
  font-size:clamp(22px,2vw,28px);
  line-height:1.5;
  color:var(--body);
}
.contact .btn{
  color:var(--ink);
  border-color:rgba(42,46,42,.24);
  background:rgba(255,255,255,.35);
}
.contact .btn:hover{
  background:rgba(255,255,255,.6);
  border-color:rgba(42,46,42,.45);
}

footer{
  background:var(--night);
  color:rgba(247,238,215,.68);
  padding:32px 24px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font:400 9px/1.5 var(--ui);
  text-transform:uppercase;
  letter-spacing:.18em;
}

/* ---------- ANIMATION ---------- */
@keyframes revealMain{
  0%{opacity:0;filter:blur(6px);transform:translateY(10px)}
  100%{opacity:1;filter:blur(0);transform:translateY(0)}
}
@keyframes fadeUp{
  0%{opacity:0;transform:translateY(10px)}
  100%{opacity:1;transform:translateY(0)}
}
@keyframes floatCue{
  0%,100%{transform:translateX(-50%) translateY(0); opacity:.55}
  50%{transform:translateX(-50%) translateY(6px); opacity:.95}
}
@keyframes mistDrift{
  from{transform:translateX(-3vw) scale(1)}
  to{transform:translateX(4vw) scale(1.06)}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px){
  :root{ --nav-h:64px; }
  .topbar{padding:0 16px}
  .brand{font-size:8px;letter-spacing:.24em}
  .hero-home .panel-content{padding-top:16vh}
  .section-hero .panel-content{padding-top:16vh}
  .about{
    grid-template-columns:1fr;
    gap:26px;
    padding:72px 0 66px;
  }
  .journal-grid{
    grid-template-columns:1fr;
  }
  footer{flex-direction:column}
}
@media (max-width: 680px){
  .panel{min-height:92svh}
  .panel-content{padding-left:18px;padding-right:18px}
  .panel-content.left{align-items:center;text-align:center}
  .section-hero .title,
  .section-hero .strap,
  .section-hero .summary{
    margin-left:auto;margin-right:auto;
  }
  .section-hero .actions{text-align:center}
  .section-hero.foundation .panel-content,.section-hero.education .panel-content{padding-left:18px;padding-right:18px}
  .section-hero.foundation .panel-copy,.section-hero.education .panel-copy{max-width:92%}
  .section-hero.foundation .kicker,.section-hero.education .kicker{font-size:11px}

}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}

/* ---------- TEXT READABILITY ONLY ---------- */
.section-hero.foundation .strap,
.section-hero.foundation .summary,
.section-hero.education .strap,
.section-hero.education .summary{
  width:fit-content;
  padding:2px 7px 3px 0;
  background:linear-gradient(
    90deg,
    rgba(8,17,28,.20) 0%,
    rgba(8,17,28,.10) 58%,
    rgba(8,17,28,0) 100%
  );
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}

/* ---------- SUBPAGES (Foundation / Education) ---------- */
.longform{
  background:var(--paper);
  padding:96px 0 30px;
}
.longform .block + .block{
  margin-top:78px;
}
.longform .kicker.light{
  margin-bottom:14px;
}
.lede{
  margin:0;
  max-width:900px;
  font:400 clamp(30px,3.4vw,48px)/1.22 var(--display);
  color:var(--ink);
}
.split{
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:6vw;
  align-items:start;
}
.split h2{
  margin:12px 0 0;
  font:400 clamp(30px,3.4vw,44px)/1.14 var(--display);
}
.prose p{
  margin:0 0 20px;
  font-size:clamp(21px,1.85vw,27px);
  line-height:1.52;
  color:var(--body);
}
.prose p:last-child{margin-bottom:0}
.rule{
  height:1px;
  background:rgba(42,46,42,.12);
  margin:0;
}
.pullquote{
  margin:0;
  padding:34px 0 34px 34px;
  border-left:2px solid rgba(200,107,70,.55);
  font:italic 400 clamp(26px,2.6vw,36px)/1.34 var(--display);
  color:var(--ink);
  max-width:860px;
}
.education-accent .pullquote{border-left-color:rgba(111,143,122,.75)}

/* placeholder blocks: remove before launch */
.ph{
  border:1px dashed rgba(42,46,42,.32);
  background:rgba(255,255,255,.34);
  padding:26px 24px;
  margin:0 0 20px;
  color:#6E7067;
  font:400 15px/1.6 var(--ui);
}
.ph:last-child{margin-bottom:0}
.ph b{
  display:block;
  margin-bottom:7px;
  font:500 10px/1.2 var(--ui);
  text-transform:uppercase;
  letter-spacing:.20em;
  color:var(--foundation);
}
.education-accent .ph b{color:var(--education)}
.ph.tall{min-height:190px}
.ph.short{min-height:110px}

.backlink{
  display:inline-flex;gap:9px;align-items:center;
  font:400 10px/1 var(--ui);
  text-transform:uppercase;letter-spacing:.20em;
  color:var(--body);
  border-bottom:1px solid currentColor;
  padding-bottom:6px;
}
.subpage-foot-cta{
  padding:80px 0 100px;
}
@media (max-width:900px){
  .longform{padding:70px 0 20px}
  .longform .block + .block{margin-top:56px}
  .split{grid-template-columns:1fr;gap:22px}
  .pullquote{padding-left:22px}
}

/* ---------- PANEL EDGE FADES ---------- */
/* replaces the old mist separator: adjacent panels dissolve into each other,
   and the final panel dissolves into the cream of the section below it */
.bg-wrap::before,
.bg-wrap::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height:130px;
  pointer-events:none;
  z-index:1;
}
.bg-wrap::before{ top:0; opacity:0 }
.bg-wrap::after{ bottom:0; opacity:0 }

/* a panel that sits below another panel: fade its top edge into darkness */
.panel + .panel .bg-wrap::before{
  opacity:1;
  background:linear-gradient(to top, rgba(8,17,30,0) 0%, rgba(8,17,30,.55) 46%, rgba(8,17,30,.94) 100%);
}
/* a panel with another panel after it: fade its bottom edge into the same darkness */
.panel:has(+ .panel) .bg-wrap::after{
  opacity:1;
  background:linear-gradient(to bottom, rgba(8,17,30,0) 0%, rgba(8,17,30,.55) 46%, rgba(8,17,30,.94) 100%);
}
/* the last panel before cream content: fade down into the paper colour instead */
.panel:has(+ .editorial) .bg-wrap::after,
.panel:has(+ .longform) .bg-wrap::after{
  opacity:1;
  height:150px;
  background:linear-gradient(to bottom, rgba(243,238,226,0) 0%, rgba(243,238,226,.60) 52%, rgba(243,238,226,1) 100%);
}

@media (max-width: 680px){
  .bg-wrap::before,.bg-wrap::after{ height:90px }
  .panel:has(+ .editorial) .bg-wrap::after,
  .panel:has(+ .longform) .bg-wrap::after{ height:110px }
}

/* ---------- FULL-SCREEN READING SECTIONS ---------- */
/* About, Journal and Contact each fill one screen on desktop
   and fall back to natural height on phones and short windows */
.pane{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:calc(var(--nav-h) + 46px) 6vw 64px;
}
.pane > .block{
  width:min(1180px, 100%);
  margin-inline:auto;
}
.pane .about{ padding:0 }
.pane .journal{ padding:0; border-top:0 }
.pane.contact{ text-align:center }

/* short windows: stop forcing a full screen so nothing is cut off */
@media (max-height: 760px){
  .pane{ min-height:auto; padding:78px 6vw 78px }
}

/* ---------- PHONE ---------- */
@media (max-width: 900px){
  .pane{
    min-height:auto;
    display:block;
    padding:74px 5vw 74px;
  }
}
@media (max-width: 680px){
  .pane{ padding:58px 18px 58px }
  .about h2,.journal h2,.contact h2{
    font-size:clamp(30px,7.6vw,42px);
    line-height:1.14;
    margin:10px 0 16px;
  }
  .about p{ font-size:19px; line-height:1.55; margin-bottom:15px }
  .about{ gap:20px }
  .journal-grid{ gap:14px; margin-top:24px }
  .card{
    min-height:0;
    padding:22px 20px;
  }
  .card h3{ font-size:23px; margin:13px 0 9px }
  .card p{ font-size:18px; line-height:1.45 }
  .contact p{ font-size:19px; line-height:1.55; margin-bottom:24px }
  .contact .btn{ width:100%; max-width:320px }
}

/* ---------- CONTACT: TWO BUTTONS ---------- */
.contact-actions{
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
}
.contact-actions .btn{ margin:0 }

/* ---------- JOURNAL: WRITTEN POST ---------- */
.post{
  margin-top:34px;
  display:grid;
  grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
  gap:44px;
  align-items:start;
}
.post-figure{
  margin:0;
  border:1px solid rgba(42,46,42,.14);
  overflow:hidden;
}
.post-figure img{
  display:block;
  width:100%;
  height:auto;
}
.post-body h3{
  margin:0 0 22px;
  font:400 clamp(28px,2.6vw,38px)/1.18 var(--display);
  color:var(--ink);
}
.post-body p{
  margin:0 0 18px;
  font-size:clamp(19px,1.5vw,22px);
  line-height:1.55;
  color:var(--body);
}
.post-body p:last-child{ margin-bottom:0 }

@media (max-width: 680px){
  .contact-actions{ flex-direction:column; align-items:center }
  .contact-actions .btn{ width:100%; max-width:320px }
  .post{ margin-top:26px; gap:24px; grid-template-columns:1fr }
  .post-figure{ max-width:340px }
  .post-body h3{ font-size:26px }
  .post-body p{ font-size:18px }
}