:root{
  /* Club colors: deep blue and gold */
  --club-navy: #071428; /* deep navy */
  --club-gold: #d6a22f; /* gold */
  --bg: #f6f8fb; /* light background */
  --card: #ffffff;
  --accent: var(--club-gold);
  --muted: #6b7480;
  --glass: rgba(255,255,255,0.03);
  --max-width: 980px;
  --texture-opacity: 0.18;
}
*{box-sizing:border-box}
html,body{height:100%}
.layout{min-height:100vh;display:flex;flex-direction:column}
/* subtle overlay to improve contrast over photos */
.layout::before{
  content:"";
  position:fixed;
  inset:0;
  /* darker overlay to bring out photo contrast */
  background: linear-gradient(180deg, rgba(6,12,24,0.45), rgba(6,12,24,0.55));
  pointer-events:none;
  z-index:0;
  mix-blend-mode: multiply;
}

/* color wash + subtle grain texture for depth */
.layout::after{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2; /* above background images */
  /* diagonal blue lines (clearer) + red wash + noise */
  background-image:
    repeating-linear-gradient(135deg, rgba(7,20,40,0.28) 0px, rgba(7,20,40,0.28) 4px, transparent 4px, transparent 28px),
    linear-gradient(120deg, rgba(200,30,45,0.12), rgba(200,30,45,0.06)),
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.35' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23f)' opacity='0.10' fill='%23ff0000'/%3E%3C/svg%3E");
  background-repeat: repeat, repeat, repeat;
  mix-blend-mode: normal;
  opacity: var(--texture-opacity, 0.18);
}
body{
  margin:0;
  font-family: 'Montserrat', Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    /* Layered background: base light gradient + photographic textures from assets/back_image */
    --img-opacity: 0.14;
    background-image:
    linear-gradient(180deg,#fbfdff 0%, #f2f6fb 70%),
    url('assets/back_image/505510313_24035104489485773_1494147342640979916_n.jpg'),
    url('assets/back_image/509358862_9920610578029602_7690470165766897557_n.jpg');
  background-size: cover, cover, cover;
  background-position: center, left center, right center;
    background-repeat: no-repeat;
    background-blend-mode: multiply, normal, normal;
  color: #ffffff;
}
.center-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px}
.logo-big{width:260px;height:260px;object-fit:contain;border-radius:18px;box-shadow:0 18px 50px rgba(7,20,40,0.08)}

.top-title, .center-wrap, .bottom, .foot { position: relative; z-index: 3 }

.top-title{font-size:58px;text-align:center;margin:6px 0 8px;color:#ffffff;letter-spacing:6px;font-weight:800}
.stay{font-size:20px;color:#ffffff;margin-top:10px}
.stay.big{font-size:36px;font-weight:800;margin-top:6px}
.social{display:flex;gap:18px;margin-top:16px;align-items:center}
.social-link{opacity:0.95}
.social-link img{display:block;width:28px;height:28px}
.social-link:hover img{transform:scale(1.06);transition:transform .18s ease}
.msg{min-height:20px;margin-top:10px;color:var(--club-navy);font-weight:600}
.bottom{text-align:center;padding:18px 0 12px;color:var(--muted);font-size:18px}
.foot{margin-top:6px;color:#ffffff;font-size:13px;text-align:center;padding:12px 0;position:fixed;left:0;right:0;bottom:6px;z-index:4}

@media (max-width:720px){
  .logo-big{width:180px;height:180px}
  .top-title{font-size:40px}
  .stay.big{font-size:28px}
}

@media (max-width:420px){
  :root{ --pattern-opacity: 0.04; --stripe-size: 10px }
  .top-title{font-size:22px}
  .logo-big{width:140px;height:140px}
  .stay.big{font-size:22px}
}