/* ===== Matchpass — shared styles for info / legal pages ===== */
:root{
  --red:#C42221; --red-dark:#A31B1A; --red-tint:#FBEDED;
  --dark:#222222; --slate:#32373C; --white:#FFFFFF; --grey:#F5F5F5; --grey-2:#ECECEC;
  --line:#E3E3E3; --line-strong:#D2D2D2; --ink:#222222; --muted:#6B6F73; --hint:#9AA0A4;
  --head:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif; --body:"Open Sans",system-ui,sans-serif;
  --r-md:10px; --r-lg:14px; --maxw:1000px; color-scheme:only light;
}
*{box-sizing:border-box;} html,body{margin:0;padding:0;}
body{font-family:var(--body); color:var(--ink); background:var(--grey); min-height:100vh; -webkit-font-smoothing:antialiased; line-height:1.6;}
h1,h2,h3,h4{font-family:var(--head); font-weight:800; text-transform:uppercase; letter-spacing:-0.01em; margin:0; line-height:.98;}
a{color:var(--red); text-decoration:none;} a:hover{text-decoration:underline;}
img{max-width:100%;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px;}

/* topnav */
.topnav{position:relative; overflow:hidden; background:#1b1e21; color:#fff;}
.topnav::before{content:""; position:absolute; inset:0; background:radial-gradient(700px 240px at 8% -40%, rgba(196,34,33,.34), transparent 60%), linear-gradient(120deg,#23272b,#16181b); background-size:180% 180%; animation:mpshift 18s ease-in-out infinite;}
@keyframes mpshift{0%,100%{background-position:0 0}50%{background-position:100% 100%}}
.topnav .wrap{position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; min-height:64px; gap:16px;}
.brand{display:flex; align-items:center;}
.brand-logo{height:38px; width:auto; display:block;}
.topnav-nav{display:flex; align-items:center; gap:20px; font-size:14px; color:#C9CDD0; flex-wrap:wrap;}
.topnav-nav a{color:#C9CDD0;}
.topnav-nav a:hover{color:#fff; text-decoration:none;}
.topnav-nav a.nav-cta{background:var(--red); color:#fff; padding:8px 16px; border-radius:8px; font-weight:700;}
.topnav-nav a.nav-cta:hover{background:var(--red-dark);}

/* page header band */
.page-head{position:relative; overflow:hidden; background:#1b1e21; color:#fff; padding:40px 0 46px;}
.page-head::before{content:""; position:absolute; inset:0; background:radial-gradient(820px 340px at 12% -20%, rgba(196,34,33,.32), transparent 60%), radial-gradient(700px 360px at 100% 130%, rgba(196,34,33,.18), transparent 60%), linear-gradient(125deg,#23272b,#16181b 60%,#1f2327); background-size:180% 180%; animation:mpshift 18s ease-in-out infinite;}
.page-head .wrap{position:relative; z-index:1;}
.crumbs{font-size:12.5px; color:#9AA0A4; margin-bottom:14px; letter-spacing:.02em;}
.crumbs a{color:#9AA0A4;} .crumbs a:hover{color:#fff;}
.page-head h1{font-size:48px; color:#fff; max-width:20ch;}
.updated{font-size:13px; color:#C9CDD0; margin:14px 0 0;}

/* content / prose */
.content{padding:40px 0 60px;}
.prose{max-width:820px; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:38px 40px;}
.prose h2{font-size:26px; color:var(--ink); margin:34px 0 12px;}
.prose h2:first-of-type{margin-top:0;}
.prose h3{font-size:19px; color:var(--ink); margin:22px 0 8px;}
.prose p{margin:0 0 14px; color:#3d4145; font-size:15.5px;}
.prose ul,.prose ol{margin:0 0 16px; padding-left:22px; color:#3d4145; font-size:15.5px;}
.prose li{margin:0 0 8px;}
.prose strong{color:var(--ink);}
.tpl-note{display:flex; gap:10px; align-items:flex-start; font-size:13px; color:#8a6d00; background:#FFF7E0; border:1px solid #F3E2A8; border-radius:10px; padding:12px 14px; margin:0 0 26px;}
.tpl-note svg{flex:0 0 auto; margin-top:1px;}

/* contact cards */
.cards{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:6px 0 24px;}
.info-card{border:1px solid var(--line); border-radius:12px; padding:22px; background:#fafafa;}
.info-card .ic{width:44px;height:44px;border-radius:11px;background:var(--red-tint);color:var(--red);display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.info-card h3{font-size:18px; margin:0 0 6px;}
.info-card p{margin:0; font-size:14px; color:#5f6368;}
.info-card a{font-weight:600;}

/* simple form (contact) */
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.field{margin-bottom:16px;}
.field label{display:block; font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px;}
.field input,.field textarea{width:100%; font-family:var(--body); font-size:15px; color:var(--ink); padding:12px 14px; border:1.5px solid var(--line); border-radius:var(--r-md); background:#fff;}
.field textarea{min-height:130px; resize:vertical;}
.field input:focus,.field textarea:focus{border-color:var(--red); outline:none;}
.btn-red{background:var(--red); color:#fff; font-family:var(--head); font-weight:800; text-transform:uppercase; letter-spacing:.02em; font-size:18px; padding:14px 30px; border-radius:var(--r-md); border:none; cursor:pointer; transition:background .15s;}
.btn-red:hover{background:var(--red-dark);}

/* faq */
.faq details{border:1px solid var(--line); border-radius:12px; padding:2px 18px; margin-bottom:12px; background:#fafafa;}
.faq summary{cursor:pointer; list-style:none; padding:16px 0; font-family:var(--head); font-weight:800; text-transform:uppercase; font-size:17px; color:var(--ink); display:flex; justify-content:space-between; align-items:center; gap:12px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; color:var(--red); font-size:22px; line-height:1;}
.faq details[open] summary::after{content:"–";}
.faq details[open] summary{border-bottom:1px solid var(--line);}
.faq .fa-body{padding:14px 0 18px; color:#3d4145; font-size:15px;}

/* footer */
.site-foot{background:#1b1e21; color:#9AA0A4; padding:40px 0 26px;}
.site-foot .foot-top{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:22px;}
.site-foot .foot-top p{margin:0; font-size:13.5px; color:#9AA0A4; max-width:52ch;}
.site-foot .brand-logo{height:34px;}
.foot-links{display:flex; flex-wrap:wrap; gap:8px 20px; padding:20px 0; border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08); font-size:13.5px;}
.foot-links a{color:#C9CDD0;} .foot-links a:hover{color:#fff;}
.foot-bottom{padding-top:20px; font-size:12.5px; color:#8A9097;}

@media(max-width:760px){
  .page-head h1{font-size:34px;}
  .prose{padding:26px 22px;}
  .cards,.form-row{grid-template-columns:1fr;}
  .topnav-nav{gap:14px; font-size:13px;}
}
