/* Tranquil Order Home Co. — site styles */
:root{
  --ever:#1F2E28; --ever2:#2F443B; --lime:#F3EEE4; --linen:#E8E0D0; --paper:#FBF8F2;
  --gold:#B08A4E; --umber:#6B5A3A; --sand:#D2B98A; --ink2:#3E4843; --rule:#D8CDB9;
  --mist:#D9D3C6; --line:#E3DACA;
  --serif:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ever);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0;line-height:1.08}
h1{font-size:clamp(48px,6.6vw,88px);line-height:1;letter-spacing:-.01em}
h2{font-size:clamp(36px,4.2vw,56px)}
h3{font-size:30px;line-height:1.15}
p{margin:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
.eyebrow{font-weight:500;font-size:13px;letter-spacing:.26em;text-transform:uppercase;color:var(--umber);margin:0 0 18px}
.on-dark .eyebrow{color:var(--sand)}
section{padding:112px 0}
.bg-lime{background:var(--lime)}
.bg-ever{background:var(--ever);color:var(--lime)}
.lede{font-size:20px;color:var(--ink2);max-width:560px;margin-top:26px}
.muted{color:var(--ink2)}
.on-dark .muted{color:var(--mist)}
.center{text-align:center}
.center .lede{margin-left:auto;margin-right:auto}
.stack{display:flex;flex-direction:column;gap:22px}
.stack > p:where(:not(.eyebrow,.best,.label,.big-price)){color:var(--ink2);font-size:18px;line-height:1.7}
.stack > p.strong{color:var(--ever);font-weight:500}
.on-dark .stack > p.muted{color:var(--mist)}

/* logo mark */
.mark path{fill:none;stroke:currentColor;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.mark .sill{stroke:var(--gold)}
.ic path,.ic rect{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* offer banner */
.offer{background:var(--ever);color:var(--lime);text-align:center;font-size:14px;padding:10px 20px;line-height:1.5}
.offer strong{font-weight:500}
.offer a{color:var(--sand);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.offer a:hover{color:#E6D3AE}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(251,248,242,.97);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:88px}
.brand{display:flex;align-items:center;gap:14px}
.brand .mark{width:30px;height:40px}
.brand-name{display:flex;flex-direction:column;gap:5px}
.brand-name b{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1}
.brand-name small{font-size:9px;font-weight:500;letter-spacing:.34em;color:var(--umber);line-height:1}
.menu{display:flex;align-items:center;gap:36px;font-size:15px}
.menu a:not(.btn):hover{color:var(--umber)}
.menu a[aria-current=page]:not(.btn){border-bottom:1px solid var(--gold);padding-bottom:3px}
.menu-toggle{display:none;width:48px;height:48px;border:0;background:none;align-items:center;justify-content:center;color:var(--ever);cursor:pointer;padding:0}
.menu-toggle .ic{width:26px;height:26px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:999px;background:var(--ever);color:var(--lime);font-weight:500;font-size:16px;border:1px solid var(--ever);transition:background .2s,color .2s;text-align:center}
.btn:hover{background:var(--ever2);border-color:var(--ever2)}
.btn-line{background:transparent;color:var(--ever)}
.btn-line:hover{background:var(--linen);border-color:var(--ever)}
.btn-light{background:var(--lime);color:var(--ever);border-color:var(--lime)}
.btn-light:hover{background:var(--linen);border-color:var(--linen)}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.trust{margin-top:22px;font-size:14px;color:var(--umber);letter-spacing:.03em}

/* layout */
.split{display:grid;grid-template-columns:1fr 1fr;gap:88px;align-items:center}
.split.top{align-items:start}
.split.flip > :first-child{order:2}
.hero{padding:88px 0 104px}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:48px}
.head-row p{max-width:460px;color:var(--ink2)}

/* arched photos */
.arch-wrap{display:flex;flex-direction:column;align-items:center}
.arch{width:min(100%,500px);aspect-ratio:5/6;border-radius:999px 999px 0 0;background-color:var(--linen);background-image:var(--img);background-size:cover;background-position:center}
.arch.sm{width:min(100%,460px)}
.sillbar{width:calc(min(100%,500px) + 48px);max-width:100%;height:7px;background:var(--gold);border-radius:4px}
.arch.sm + .sillbar{width:calc(min(100%,460px) + 44px)}

/* service cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:56px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:34px 28px;display:flex;flex-direction:column;gap:16px;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(31,46,40,.08)}
.card .ic{width:36px;height:36px}
.card p{font-size:16px;color:var(--ink2)}
.card .more{margin-top:auto;font-size:14px;font-weight:500;color:var(--umber)}

/* pillars */
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:64px}
.pillar{border-top:1px solid var(--gold);padding-top:28px}
.pillar h3{margin-bottom:12px}
.pillar p{font-size:16px;color:var(--mist)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:56px;margin-top:64px;text-align:center}
.num{font-family:var(--serif);font-size:64px;line-height:1;color:var(--gold)}
.step h3{margin:14px 0 12px;font-size:32px}
.step p{margin:0 auto;max-width:340px;color:var(--ink2)}

/* list rows */
.rows{margin-top:28px}
.rows div{padding:18px 0;border-top:1px solid var(--rule);font-size:18px}
.rows div:last-child{border-bottom:1px solid var(--rule)}
.rows strong{font-weight:500}

/* cta */
.cta{padding:136px 0;text-align:center}
.cta .mark{width:42px;height:56px;margin:0 auto 26px}
.cta h2{font-size:clamp(44px,6vw,72px)}
.cta p{margin-top:18px;font-size:19px;color:var(--ink2)}
.cta .actions{justify-content:center}

/* services page */
.checks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.checks li{display:flex;gap:14px;color:var(--ink2)}
.checks li::before{content:"";flex:0 0 7px;height:7px;border-radius:50%;background:var(--gold);margin-top:.68em}
.label{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--umber);font-weight:500}
.price{display:flex;align-items:baseline;gap:12px;padding-top:18px;border-top:1px solid var(--rule)}
.price b{font-family:var(--serif);font-size:34px;font-weight:500;line-height:1}
.best{font-size:16px;color:var(--umber)}
.best strong{font-weight:500}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:88px}
.duo > div + div{border-left:1px solid #3A4A43;padding-left:64px}
.big-price{font-family:var(--serif);font-size:44px;line-height:1;color:var(--lime);margin-top:6px}

/* about */
.founder{display:grid;grid-template-columns:280px 1fr;gap:80px;align-items:start}
.founder-mark{width:280px;height:280px;border-radius:50%;background:var(--lime);display:flex;align-items:center;justify-content:center;color:var(--ever)}
.founder-mark .mark{width:84px;height:112px}
.note > p:where(:not(.eyebrow,.sig,.sig-name)){font-size:19px;line-height:1.75;color:var(--ink2);margin-bottom:22px;max-width:720px}
.sig{font-family:'Mrs Saint Delafield',cursive;font-size:64px;line-height:1;color:var(--ever);margin-top:8px}
.sig-name{font-size:15px;font-weight:500;color:var(--umber);letter-spacing:.04em;margin-top:6px}

/* book */
.book-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:64px;align-items:start}
.scheduler{background:var(--lime);border-radius:20px;overflow:hidden;min-height:760px}
.calendly-inline-widget{min-width:300px;height:760px}
.next{display:flex;flex-direction:column;gap:28px}
.next-item{display:flex;gap:20px}
.next-item .num{font-size:36px;width:44px;flex-shrink:0}
.next-item h3{font-size:26px;margin-bottom:6px}
.next-item p{font-size:16px;color:var(--ink2)}
.contact-card{background:var(--ever);color:var(--lime);border-radius:20px;padding:36px;display:flex;flex-direction:column;gap:12px;margin-top:40px}
.contact-card .phone{font-family:var(--serif);font-size:32px;line-height:1.1}
.contact-card a:hover{color:var(--sand)}
.contact-card p{font-size:15px;color:var(--mist)}
.offer-card{border:1px solid var(--gold);border-radius:20px;padding:28px 32px;margin-top:24px}
.offer-card h3{font-size:26px;margin-bottom:8px}
.offer-card p{font-size:16px;color:var(--ink2)}
.faq{display:grid;grid-template-columns:1fr 1fr;column-gap:72px;margin-top:48px}
.qa{padding:28px 0;border-top:1px solid var(--rule)}
.qa h3{font-size:26px;margin-bottom:10px;line-height:1.2}
.qa p{font-size:16px;color:var(--ink2)}

/* footer */
.site-footer{background:var(--ever);color:var(--linen);padding:80px 0 40px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px}
.site-footer a:hover{color:var(--sand)}
.foot-col{display:flex;flex-direction:column;gap:12px;font-size:16px}
.foot-col .eyebrow{color:var(--sand);margin:0 0 4px}
.brand.light{color:var(--lime)}
.brand.light .brand-name small{color:var(--sand)}
.foot-tag{font-family:var(--serif);font-size:28px;line-height:1.25;color:var(--lime);max-width:380px;margin-top:24px}
.foot-bottom{margin-top:56px;border-top:1px solid #3A4A43;padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:14px;color:#BDB6A7}

/* responsive */
@media (max-width:1100px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .menu{gap:26px}
}
@media (max-width:900px){
  section{padding:80px 0}
  .wrap{padding:0 20px}
  .hero{padding:48px 0 72px}
  .split,.duo,.book-grid,.founder,.faq,.foot-grid{grid-template-columns:1fr;gap:48px}
  .faq{gap:0}
  .split.flip > :first-child{order:0}
  .duo > div + div{border-left:0;padding-left:0;border-top:1px solid #3A4A43;padding-top:48px}
  .head-row{flex-direction:column;align-items:flex-start;gap:20px}
  .steps{grid-template-columns:1fr;gap:44px}
  .founder-mark{width:180px;height:180px}
  .founder-mark .mark{width:54px;height:72px}
  .cta{padding:96px 0}
  .menu-toggle{display:flex}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);flex-direction:column;align-items:stretch;gap:0;padding:4px 20px 24px;border-bottom:1px solid var(--line);box-shadow:0 16px 30px rgba(31,46,40,.08)}
  .menu.open{display:flex}
  .menu a:not(.btn){padding:15px 0;border-bottom:1px solid #EAE2D3;font-size:17px}
  .menu a[aria-current=page]:not(.btn){padding-bottom:15px;border-bottom:1px solid #EAE2D3;color:var(--umber)}
  .menu .btn{margin-top:18px}
}
@media (max-width:600px){
  body{font-size:16px}
  .nav{height:72px}
  .brand-name b{font-size:21px}
  .brand-name small{font-size:8px}
  .brand .mark{width:24px;height:32px}
  .cards,.pillars{grid-template-columns:1fr}
  .actions .btn{width:100%}
  .lede{font-size:18px}
  .stack > p:where(:not(.eyebrow,.best,.label,.big-price)),.note > p:where(:not(.eyebrow,.sig,.sig-name)){font-size:17px}
  .rows div{font-size:16px}
  .contact-card{padding:28px}
  .sig{font-size:54px}
}

/* ---- Realtor partner page ---- */
.pkgs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px}
.pkg{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:36px 30px;display:flex;flex-direction:column;gap:18px}
.pkg.feature{border:1.5px solid var(--gold);box-shadow:0 14px 30px rgba(31,46,40,.08)}
.pkg .tag{align-self:flex-start;font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;background:var(--ever);color:var(--lime);border-radius:999px;padding:6px 12px}
.pkg p{font-size:16px;color:var(--ink2)}
.pkg .price{margin-top:auto}
.gift-table{width:100%;border-collapse:collapse;margin-top:8px;font-size:17px}
.gift-table th{text-align:left;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--sand);font-weight:500;padding:0 0 12px;border-bottom:1px solid #3A4A43}
.gift-table td{padding:14px 0;border-bottom:1px solid #3A4A43;color:var(--mist)}
.gift-table td:first-child{font-family:var(--serif);font-size:26px;color:var(--lime)}
.gift-table th:last-child,.gift-table td:last-child{text-align:right}
.gift-table td:last-child{color:var(--sand);font-weight:500}
.slim-nav{display:flex;align-items:center;gap:24px;font-size:15px}
@media (max-width:1100px){.pkgs{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.pkgs{grid-template-columns:1fr}.slim-nav .hide-sm{display:none}}
.pillars.light .pillar p{color:var(--ink2)}