/* Dare Apps — plain HTML version of the original WordPress theme */
*{box-sizing:border-box}
html,body{margin:0}
body{background:#fff;color:#000;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:#555;text-decoration:none}
a:hover{color:#c62828}
img{max-width:100%;height:auto;display:block}

/* Top bar */
.topbar{background:#f7f7f7;border-bottom:1px solid #eaeaea}
.topbar .inner{max-width:960px;margin:0 auto;padding:0 20px;display:flex;justify-content:flex-end}
.menu{list-style:none;margin:0;padding:0;display:flex}
.menu > li{position:relative}
.menu a{display:block;padding:12px 14px;font-size:12px;color:#8a8a8a}
.menu a:hover,.menu a[aria-current="page"]{color:#000}
.menu .sub{list-style:none;margin:0;padding:6px 0;position:absolute;right:0;top:100%;min-width:220px;background:#fff;border:1px solid #eaeaea;box-shadow:0 4px 12px rgba(0,0,0,.06);display:none;z-index:10}
.menu li:hover > .sub,.menu li:focus-within > .sub{display:block}

/* Layout */
.page{max-width:960px;margin:0 auto;padding:56px 20px 40px;display:grid;grid-template-columns:300px 1fr;gap:0}
.intro{padding-right:40px;text-align:center}
.intro .logo{margin:20px auto 22px;width:250px}
.intro p{margin:0;color:#666;font-size:13px;line-height:1.7}
.content{border-left:1px solid #eaeaea;padding-left:40px;min-height:360px}
.content h1{font-family:Quicksand,"Helvetica Neue",Helvetica,sans-serif;font-weight:400;font-size:28px;color:#999;margin:8px 0 18px}
.content h2{font-family:Quicksand,"Helvetica Neue",Helvetica,sans-serif;font-weight:500;font-size:18px;color:#777;margin:26px 0 8px}
.content p{color:#555;margin:0 0 14px}

/* Home phones */
.phones{display:flex;justify-content:center;align-items:flex-end;padding:10px 0 20px}
.phone{background:#111;border-radius:34px;padding:52px 12px;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.phone img{border-radius:2px}
.phone.back{width:210px;transform:translateX(24px);z-index:0;opacity:.95}
.phone.front{width:236px;position:relative;z-index:1}

/* Footer */
.footer{text-align:center;padding:10px 20px 48px}
.footer span{display:inline-block;background:#f4f4f4;color:#888;font-size:11px;padding:4px 10px;border-radius:2px}

@media (max-width:760px){
  .page{grid-template-columns:1fr;padding-top:32px}
  .intro{padding:0 0 28px}
  .content{border-left:0;border-top:1px solid #eaeaea;padding:28px 0 0;min-height:0}
  .phone.back{width:44%}.phone.front{width:48%}
  .phone{border-radius:26px;padding:38px 8px}
}