/* Two Unlimited – Static Website */
/* Fonts */
@font-face{
  font-family:"BasierSquare";
  src:url("assets/basiersquare-regular-webfont.woff2") format("woff2"),
      url("assets/basiersquare-regular-webfont.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"BasierSquare";
  src:url("assets/basiersquare-medium-webfont.woff2") format("woff2"),
      url("assets/basiersquare-medium-webfont.woff") format("woff");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"BasierSquare";
  src:url("assets/basiersquare-semibold-webfont.woff2") format("woff2"),
      url("assets/basiersquare-semibold-webfont.woff") format("woff");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"BasierSquare";
  src:url("assets/basiersquare-bold-webfont.woff2") format("woff2"),
      url("assets/basiersquare-bold-webfont.woff") format("woff");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

:root{
  --bg:#b7b9a1;
  --ink:#16232b;
  --ink-2:#1b2a33;
  --accent:#a7e236;
  --line:rgba(22,35,43,.35);
  --max:1120px;
  --pad:56px;
}

::selection{
	background-color: var(--accent);
	color: black;
}
html, body {
  margin: 0;
  padding: 0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; overflow-x: hidden;}
body{
  margin:0;
  font-family:"BasierSquare", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:var(--bg);
  min-height:100vh;
}

a{color:inherit; text-decoration:none}
a:hover{text-decoration:none}
img{max-width:100%; height:auto; display:block}

.bg-gradient{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height:auto;
  z-index:-1;
  pointer-events:none;
  /* keeps the bright center near the bottom, like the PDF */
  transform:translateY(10%);
  opacity:1;
}

.team{
  position: relative;
  width: 110%;
  max-width: none;
  left: -5%;
  height: 40%;
  bottom:10.6em;
  z-index:-1;
  pointer-events:none;
  /* keeps the bright center near the bottom, like the PDF */
  transform:translateY(10%);
  opacity:1;
}

.wrap{
  margin:0 auto;
	width: 100%;
  padding: 0 2rem;
}

.header{
  padding:20px 0 0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
}

.logo{
  width:min(520px, 70vw);
}

.buttons {
position: absolute;
right: 20px;
top: 20px;
	
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 30px;
  border:1.5px solid var(--ink);
  border-radius:999px;
  font-weight:500;
  font-size:16px;
  line-height:1;
  background:transparent;
  white-space:nowrap;
  margin-top: 25px;
}

.btn-language{
  display:inline-flex;
  padding: 10px 18px;
  border:1.5px solid var(--ink);
  border-radius:999px;
  font-weight:500;
  font-size:16px;
  line-height:1;
  background:transparent;
  white-space:nowrap;
  margin-top: 25px;
  margin-left: 7px;
}

.btn:hover{background:rgba(255,255,255,.10); text-decoration:none}

.main{
  padding:290px 0 0;
}

.lead{
  font-weight: 500;
  font-size: 3.6rem;
  line-height: 1.1;
  letter-spacing: -0.025em;
  margin: 0 0 40px;
  max-width: 100%;
  hyphens: none;
}
.bodycopy{
  font-size: 1.4rem;
  line-height: 1.4;
  margin: 0;
  max-width: 100%;
}
.bodycopy strong{font-weight:700}

.claim-row{
  margin-top:120px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:32px;
}

.claim{
  font-weight:700;
  font-size: 10vw;
  line-height:.92;
  letter-spacing:-0.02em;
  text-transform:uppercase;
  margin:0;
}
.claim .accent{color:var(--accent)}
.bar{
  width: 110px;
  height: 30px;
  background: var(--ink);
  margin-top: clamp(42px, 10vw, 145px);
  flex: 0 0 auto;
}

.contact{
  padding:0px 0 0px;
}
.contact h2{
  margin:160px 0 14px;
  font-size:16px;
  font-weight:700;
}
.contact .addr{
  font-size:clamp(20px, 2.2vw, 28px);
  line-height:1.2;
  margin:0;
}
.big-mail a {
  width: 100%;
  display: block;
  font-weight: 600;
  line-height: 0.95;
  letter-spacing: -0.02em;
  white-space: nowrap;
  font-size: 9.8vw;
  margin: 60px 0 0;
}

.footer{
  padding: 20px 0 32px;
}

.footer .rule {
  height:1px;
  background:var(--line);
  margin:0 0 12px;
}
.footer nav{
  display:flex;
  gap:18px;
  font-size:12px;
  font-weight:500;
}

/* Legal pages */
.legal{
  padding:20px 2rem 0px;
}
.legal .topline{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:22px;
}
.legal h1{
  margin:0;
  font-size:22px;
  font-weight:500;
  line-height:1.25;
}
.legal .sub{
  margin:3px 0 0;
  font-size:18px;
  font-weight:500;
}
.close{
  font-size: 35px;
  line-height: 0.8;
  padding: 0px 8px;
  border-radius:0px;
}
.close:hover{background:rgba(255,255,255,.10); text-decoration:none}
.legal .content{
  max-width: 100%;
  font-size:clamp(15px, 1.35vw, 18px);
  line-height:1.33;
}
.legal .content h2{
  font-size:18px;
  margin:25px 0 3px;
  font-weight:500;
}
.legal .content p{
  margin:0 0 15px;
}
.legal .mono-block{
  margin:0 0 18px;
  white-space:pre-line;
}

/* Breakpoints */
@media (max-width: 1024px){
  :root{ --pad:32px; }
  .main{ padding-top:250px; }
  .claim-row{ margin-top:90px; }
  .contact{ padding-top:0px; }
}

.contact h2 {
  margin: 100px 0 14px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.02em;	
}

.claim {
  font-size: 12vw;
}

.bar {
  width: 100px;
  height: 26px;
  margin-top: 14%;
}

.lead {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.1;
  letter-spacing: -0.025em;
  margin: 0 0 40px;
  hyphens: auto;
}

.team{
  bottom:7.3em;
}


.bodycopy {
  font-size: 1.3rem;
  line-height: 1.35;
  hyphens: auto;
}

.big-mail a {
  font-size: 9.66vw;
}

.footer {
  padding: 10px 0 25px;
}


@media (max-width: 640px){
	
	body{
		overflow-x: hidden;
	}
	
  :root{ --pad:18px; }
	
  .logo {
    width: 100%;
}

  .header{ 
	padding-top: 16px;
    display: grid; }
	
  .btn{ padding: 8px 14px;
    font-size: 16px;
    margin-top: 0px;
  }
	
  .btn-language {
    display: inline-flex;
    padding: 8px 20px;
    border: 1.5px solid var(--ink);
    border-radius: 999px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    background: transparent;
    white-space: nowrap;
	margin-top: 0px;
    margin-left: 7px;
}
	
   .buttons {
    margin-top: 16%;
    position: absolute;
	right: 0.9rem;
}
	
  .main{ padding-top:160px; }
	
  .claim-row{ margin-top: 56px; display: grid;}
  .bar{ 
	width: 16%;
    height: 22px;
    margin: 0 0 0 6px;
   }

.claim-row{
  gap:60px;
}
	
  .contact{ padding-top:72px; }
  .footer nav{ gap:14px; }
  .lead {
  font-weight: 500;
  font-size: 2rem;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0 0 35px;
  max-width: 100%;
  hyphens: auto;
}
	
  .claim {
  font-weight: 700;
  font-size: 19vw;
  line-height: .92;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  margin: 0;
}
	
  .bodycopy {
  font-size: 1.3rem;
  line-height: 1.3;
  margin: 0;
  max-width: 100%;
  hyphens: auto;
}
	
  .contact h2 {
    margin: 60px 0 13px;
    font-size: 15px;
  }
	
  .bg-gradient {
    width: 200%;
    max-width: none;
    left: -50%;
    height: 40%;
    z-index: -1;
    transform: translateY(0%);
}
	
  .team{
  width: 200%;
  max-width: none;
  left: -50%;
  height: 40%;
  bottom:8.3em;
  z-index:-1;
  pointer-events:none;
  /* keeps the bright center near the bottom, like the PDF */
  transform:translateY(0%);
  opacity:1;
}
	
  .legal .topline {
  margin: 16px 0 0 0;
}
	
  .btn:hover{background: none; text-decoration:none}


/* Prevent email line-break on mobile */
@media (max-width: 640px) {
  .contact-email,
  .contact-email a {
    white-space: nowrap;
    word-break: keep-all;
  }
}




/* Layout wrapper (PDF-like): no extra outer margins; side spacing via width calc */
.wrap {
  width: min(var(--max), 100% - (var(--pad) * 2));
  margin-inline: auto;
}


/* Contact section corrections */
.contact {
  padding: 0;
}

/* Normal content stays aligned */
.contact .wrap {
  margin-inline: auto;
}

/* Full-bleed email */
.contact-full {
  width: 100%;
  margin: 0;
  padding: 0;
}

.big-mail {
  width: 100%;
  margin: 50px 0 0;
  font-weight: 700;
  line-height: .95;
  letter-spacing: -0.02em;

  font-size: min(
    clamp(44px, 7.8vw, 110px),
    14vw
  );

  white-space: nowrap;
  overflow: hidden;
}

.big-mail a {
  display: block;
  width: 100%;
  text-decoration: none;
  color: inherit;
}


/* =========================
   STARTPAGE LAYOUT FIX
   ========================= */

/* Global content spacing: full viewport with light side padding */
.wrap{
  margin:0 auto;
  width: 100%;
  padding: 0 0.9rem;
}

/* Contact section: email spans full viewport width,
   but aligns visually with content padding */
.contact-full {
  width: 100%;
  padding-left: clamp(20px, 4vw, 48px);
  padding-right: clamp(20px, 4vw, 48px);
}

/* Big mail: visually full-width, no wrapping */
.big-mail {
  width: 100%;
  margin: 50px 0 0;
  font-weight: 700;
  line-height: .95;
  letter-spacing: -0.02em;

  font-size: min(
    clamp(38px, 7.8vw, 110px),
    14vw
  );

  white-space: nowrap;
}

/* Anchor inherits full width */
.big-mail a {
  display: block;
  width: 100%;
  text-decoration: none;
  color: inherit;
  font-size: 9.5vw;
  margin: 0;
}
	
 .footer {
  padding: 15px 0 25px;
}
}