/* ============================================================
   style.css — Riyaan Shaikh Portfolio
   All visual styles in one file for easy hosting.
   ============================================================ */

:root {
  --bg: #080808;
  --surface: #0f0f0f;
  --accent: #ff3c00;
  --accent2: #ffb800;
  --text: #f0ece4;
  --muted: #585858;
  --border: #1c1c1c;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background:var(--bg);
  color:var(--text);
  font-family:'DM Sans',sans-serif;
  font-weight:300;
  overflow-x:hidden;
  cursor:none;
}

/* ── CUSTOM CURSOR ──────────────────────────────────────────── */
.cursor {
  width:8px; height:8px;
  background:var(--accent);
  border-radius:50%;
  position:fixed;
  pointer-events:none;
  z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .12s,height .12s,background .12s;
}
.cursor-ring {
  width:30px; height:30px;
  border:1.5px solid var(--accent);
  border-radius:50%;
  position:fixed;
  pointer-events:none;
  z-index:9998;
  transform:translate(-50%,-50%);
}
body.cur-hover .cursor { width:18px; height:18px; background:var(--accent2); }
body.cur-hover .cursor-ring {
  border-color:var(--accent2);
  transform:translate(-50%,-50%) scale(1.7);
  transition:transform .15s,border-color .15s;
}

/* ── NOISE OVERLAY ──────────────────────────────────────────── */
body::before {
  content:'';
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:500;
}

/* ── NAV ────────────────────────────────────────────────────── */
nav {
  position:fixed;
  top:0; left:0; right:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1.4rem 4rem;
  background:linear-gradient(to bottom,rgba(8,8,8,.95) 0%,transparent 100%);
  transition:background .3s,backdrop-filter .3s;
}
nav.scrolled { background:rgba(8,8,8,.92); backdrop-filter:blur(16px); }
.nav-logo {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.6rem;
  letter-spacing:.1em;
  color:var(--text);
  text-decoration:none;
}
.nav-links { display:flex; gap:2.5rem; list-style:none; }
.nav-links a {
  font-family:'JetBrains Mono',monospace;
  font-size:.7rem;
  color:var(--muted);
  text-decoration:none;
  letter-spacing:.14em;
  text-transform:uppercase;
  transition:color .2s;
  position:relative;
}
.nav-links a::after {
  content:'';
  position:absolute;
  bottom:-4px; left:0; right:0;
  height:1px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .28s cubic-bezier(.4,0,.2,1);
}
.nav-links a:hover { color:var(--text); }
.nav-links a:hover::after { transform:scaleX(1); }

/* ── HERO ───────────────────────────────────────────────────── */
#hero {
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  overflow:hidden;
  padding:0 4rem 7rem;
}
.hero-grid-bg {
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--border) 1px,transparent 1px),
    linear-gradient(90deg,var(--border) 1px,transparent 1px);
  background-size:60px 60px;
  opacity:.3;
}
.hero-orb {
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  filter:blur(90px);
}
.hero-orb-1 {
  width:560px; height:560px;
  background:radial-gradient(circle,rgba(255,60,0,.15) 0%,transparent 70%);
  top:-100px; left:-100px;
  animation:orb1 9s ease-in-out infinite;
}
.hero-orb-2 {
  width:400px; height:400px;
  background:radial-gradient(circle,rgba(255,184,0,.08) 0%,transparent 70%);
  bottom:5%; right:8%;
  animation:orb2 13s ease-in-out infinite;
}
@keyframes orb1 {
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(70px,50px) scale(1.1)}
}
@keyframes orb2 {
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(-50px,-35px) scale(1.09)}
}
.hero-watermark {
  position:absolute;
  right:-0.02em; bottom:-0.14em;
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(12rem,24vw,24rem);
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.035);
  line-height:1;
  user-select:none;
  pointer-events:none;
  letter-spacing:-.02em;
  z-index:0;
}
.hero-content { position:relative; z-index:2; }
.hero-tag {
  font-family:'JetBrains Mono',monospace;
  font-size:.7rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1.6rem;
  display:flex;
  align-items:center;
  gap:1rem;
}
.hero-tag::before {
  content:'';
  display:block;
  width:38px; height:1px;
  background:var(--accent);
}
.hero-name { font-family:'Bebas Neue',sans-serif; line-height:.88; overflow:visible; }
.hero-name-line { display:block; overflow:hidden; }
.hero-name-line span { display:inline-block; }
.name-first  { font-size:clamp(6rem,14vw,14rem); letter-spacing:-.02em; color:var(--text); }
.name-second { font-size:clamp(6rem,14vw,14rem); letter-spacing:-.02em; color:transparent; -webkit-text-stroke:1.5px var(--text); }
.hero-name:hover .name-first  { animation:glitch1 .4s steps(2,end); }
.hero-name:hover .name-second { animation:glitch2 .4s steps(2,end); }
@keyframes glitch1 {
  0%{clip-path:none;transform:none}
  20%{clip-path:polygon(0 20%,100% 20%,100% 40%,0 40%);transform:translate(-4px,0)}
  40%{clip-path:polygon(0 60%,100% 60%,100% 80%,0 80%);transform:translate(4px,0)}
  60%{clip-path:none;transform:translate(-2px,0)}
  100%{clip-path:none;transform:none}
}
@keyframes glitch2 {
  0%{transform:none}
  25%{transform:translate(6px,0)}
  50%{transform:translate(-6px,0)}
  75%{transform:translate(3px,0)}
  100%{transform:none}
}
.hero-role-line { display:flex; align-items:center; gap:1.5rem; margin-top:1.4rem; }
.hero-role-text { font-family:'JetBrains Mono',monospace; font-size:.85rem; color:var(--muted); letter-spacing:.08em; }
.hero-role-dot { width:6px; height:6px; background:var(--accent); border-radius:50%; animation:blink 1.6s ease-in-out infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.2} }
.hero-cta { display:flex; gap:1.2rem; align-items:center; margin-top:3rem; }
.btn-primary {
  background:var(--accent);
  color:#fff;
  padding:.9rem 2.4rem;
  font-family:'JetBrains Mono',monospace;
  font-size:.72rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  text-decoration:none;
  border:none;
  cursor:none;
  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
  transition:background .2s,letter-spacing .2s;
}
.btn-primary:hover { background:#d93000; letter-spacing:.2em; }
.btn-ghost {
  color:var(--muted);
  font-family:'JetBrains Mono',monospace;
  font-size:.72rem;
  letter-spacing:.1em;
  text-decoration:none;
  border-bottom:1px solid var(--border);
  padding-bottom:3px;
  transition:color .2s,border-color .2s;
}
.btn-ghost:hover { color:var(--text); border-color:var(--text); }
.scroll-ind {
  position:absolute;
  bottom:2.2rem; left:50%;
  transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  font-family:'JetBrains Mono',monospace;
  font-size:.6rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted); z-index:5;
}
.scroll-line {
  width:1px; height:48px;
  background:linear-gradient(to bottom,var(--accent),transparent);
  animation:scrollV 2s ease-in-out infinite;
}
@keyframes scrollV {
  0%,100%{transform:scaleY(1);opacity:1}
  50%{transform:scaleY(.35);transform-origin:top;opacity:.35}
}

/* ── SECTIONS ───────────────────────────────────────────────── */
section { padding:8rem 4rem; position:relative; }
.section-label {
  font-family:'JetBrains Mono',monospace;
  font-size:.62rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--accent); margin-bottom:1rem;
  display:flex; align-items:center; gap:1rem;
}
.section-label::after {
  content:''; flex:1; max-width:56px;
  height:1px; background:var(--accent);
}
.section-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3rem,6vw,5.5rem);
  letter-spacing:.02em; line-height:1;
  margin-bottom:4rem;
}

/* ── ABOUT ──────────────────────────────────────────────────── */
#about {
  background:var(--surface);
  display:grid; grid-template-columns:1fr 1fr; gap:6rem;
  align-items:center; border-top:1px solid var(--border);
}
.about-text p { font-size:1rem; line-height:1.9; color:#888; margin-bottom:1.4rem; }
.about-text p strong { color:var(--text); font-weight:500; }
.about-details { margin-top:2rem; display:flex; flex-direction:column; }
.detail-row {
  display:flex; justify-content:space-between; align-items:center;
  padding:.85rem 0; border-bottom:1px solid var(--border); font-size:.875rem;
}
.detail-key { font-family:'JetBrains Mono',monospace; font-size:.65rem; text-transform:uppercase; letter-spacing:.12em; color:var(--muted); }
.detail-val { color:var(--text); font-weight:400; }
.edu-card {
  border:1px solid var(--border); padding:2rem;
  position:relative; margin-bottom:1.4rem; transition:border-color .3s;
}
.edu-card:hover { border-color:#2e2e2e; }
.edu-card::before {
  content:''; position:absolute;
  top:0; left:0; width:3px; height:100%; background:var(--accent);
}
.edu-year { font-family:'JetBrains Mono',monospace; font-size:.62rem; color:var(--accent); letter-spacing:.16em; text-transform:uppercase; margin-bottom:.5rem; }
.edu-degree { font-family:'Bebas Neue',sans-serif; font-size:1.45rem; letter-spacing:.04em; margin-bottom:.3rem; }
.edu-school { color:var(--muted); font-size:.875rem; }
.edu-gpa { position:absolute; top:1.4rem; right:1.4rem; font-family:'Bebas Neue',sans-serif; font-size:2rem; color:var(--accent2); opacity:.55; }

/* ── SKILLS ─────────────────────────────────────────────────── */
#skills { border-top:1px solid var(--border); }
.skills-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:1px; background:var(--border);
  border:1px solid var(--border); margin-bottom:4rem;
}
.skill-cell {
  background:var(--bg); padding:1.8rem 1.5rem;
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:space-between; gap:.8rem;
  text-decoration:none; color:var(--text); transition:background .3s;
}
.skill-cell:hover { background:#111; }
.skill-cell:hover .skill-bar { transform:scaleY(1); }
.skill-cell:hover .skill-arrow { opacity:1; transform:translateX(0); }
.skill-bar {
  position:absolute; top:0; left:0; width:2px; height:100%;
  background:var(--accent); transform:scaleY(0); transform-origin:top;
  transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.skill-left { display:flex; align-items:center; gap:1rem; }
.skill-icon { font-size:1.4rem; width:34px; text-align:center; flex-shrink:0; }
.skill-name { font-family:'JetBrains Mono',monospace; font-size:.75rem; letter-spacing:.04em; }
.skill-arrow { font-size:.7rem; color:var(--accent); opacity:0; transform:translateX(-6px); transition:opacity .25s,transform .25s; }
.soft-skills-row { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:2rem; }
.soft-tag {
  font-family:'JetBrains Mono',monospace; font-size:.64rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted); border:1px solid var(--border);
  padding:.42rem 1rem; transition:all .22s; cursor:default;
}
.soft-tag:hover { color:var(--accent); border-color:var(--accent); }

/* ── SKILL MODAL ────────────────────────────────────────────── */
.skill-modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.85);
  z-index:1000; display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .3s; backdrop-filter:blur(8px);
}
.skill-modal-overlay.open { opacity:1; pointer-events:all; }
.skill-modal {
  background:var(--surface); border:1px solid var(--border);
  max-width:640px; width:90%; max-height:85vh; overflow-y:auto;
  position:relative; transform:translateY(24px) scale(.97);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.skill-modal-overlay.open .skill-modal { transform:translateY(0) scale(1); }
.modal-header {
  padding:2rem 2rem 1.5rem; border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
}
.modal-title-row { display:flex; align-items:center; gap:1rem; }
.modal-icon { font-size:2rem; }
.modal-title { font-family:'Bebas Neue',sans-serif; font-size:2.2rem; letter-spacing:.04em; }
.modal-close { background:none; border:none; color:var(--muted); font-size:1.4rem; cursor:none; padding:.3rem; transition:color .2s; }
.modal-close:hover { color:var(--accent); }
.modal-body { padding:2rem; }
.modal-tag {
  display:inline-block; font-family:'JetBrains Mono',monospace;
  font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); border:1px solid var(--accent); padding:.25rem .7rem; margin-bottom:1.5rem;
}
.modal-desc { font-size:.95rem; line-height:1.85; color:#888; margin-bottom:1.8rem; }
.modal-facts { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.8rem; }
.fact-box { border:1px solid var(--border); padding:1rem 1.2rem; }
.fact-label { font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.15em; text-transform:uppercase; color:var(--muted); margin-bottom:.35rem; }
.fact-val { font-size:.9rem; font-weight:500; color:var(--text); }
.modal-uses { margin-bottom:1.8rem; }
.modal-uses-title { font-family:'JetBrains Mono',monospace; font-size:.65rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:.8rem; }
.modal-uses ul { list-style:none; display:flex; flex-direction:column; gap:.45rem; }
.modal-uses li { font-size:.875rem; color:#777; padding-left:1.2rem; position:relative; }
.modal-uses li::before { content:'→'; position:absolute; left:0; color:var(--accent); font-size:.75rem; }
.modal-link {
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:'JetBrains Mono',monospace; font-size:.68rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text); text-decoration:none;
  border:1px solid var(--border); padding:.7rem 1.4rem; transition:all .25s;
}
.modal-link:hover { background:var(--accent); border-color:var(--accent); }

/* ── WORK ───────────────────────────────────────────────────── */
#work { background:var(--surface); border-top:1px solid var(--border); }
.work-featured {
  display:grid; grid-template-columns:1.2fr 0.8fr;
  border:1px solid var(--border); margin-bottom:3rem; overflow:hidden;
}
.work-img {
  background:#0d0d0d; min-height:400px;
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.work-img-pattern {
  position:absolute; inset:0;
  background-image:repeating-linear-gradient(45deg,transparent,transparent 20px,#141414 20px,#141414 21px);
}
.work-img-icon {
  font-size:5rem; position:relative; z-index:1;
  display:flex; flex-direction:column; align-items:center; gap:.6rem;
}
.work-img-icon span { font-family:'JetBrains Mono',monospace; font-size:.65rem; color:var(--muted); letter-spacing:.12em; text-transform:uppercase; }
.work-badge {
  position:absolute; top:1.5rem; left:1.5rem;
  background:var(--accent); color:#fff;
  font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.16em;
  text-transform:uppercase; padding:.3rem .85rem;
  clip-path:polygon(4px 0%,100% 0%,calc(100% - 4px) 100%,0% 100%);
}
.work-content { padding:3rem; display:flex; flex-direction:column; justify-content:center; border-left:1px solid var(--border); }
.work-number { font-family:'Bebas Neue',sans-serif; font-size:5rem; color:#1a1a1a; line-height:1; margin-bottom:1rem; }
.work-title { font-family:'Bebas Neue',sans-serif; font-size:2.1rem; letter-spacing:.04em; line-height:1.1; margin-bottom:1.1rem; }
.work-desc { color:var(--muted); font-size:.9rem; line-height:1.75; margin-bottom:2rem; }
.work-tags { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:2rem; }
.work-tag { background:var(--bg); border:1px solid var(--border); font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.1em; color:var(--muted); padding:.3rem .85rem; text-transform:uppercase; }
.work-features { list-style:none; display:flex; flex-direction:column; gap:.65rem; }
.work-features li { font-size:.875rem; color:#6a6a6a; padding-left:1.3rem; position:relative; }
.work-features li::before { content:'→'; position:absolute; left:0; color:var(--accent); font-size:.75rem; }

/* ── BLOG ───────────────────────────────────────────────────── */
#blog { border-top:1px solid var(--border); }
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.blog-card { background:var(--bg); padding:2.5rem; position:relative; overflow:hidden; transition:background .3s; cursor:none; }
.blog-card:hover { background:#0b0b0b; }
.blog-num { font-family:'Bebas Neue',sans-serif; font-size:3.8rem; color:var(--border); line-height:1; margin-bottom:1.4rem; transition:color .3s; }
.blog-card:hover .blog-num { color:#1e1e1e; }
.blog-cat { font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin-bottom:.75rem; }
.blog-title { font-family:'Bebas Neue',sans-serif; font-size:1.35rem; letter-spacing:.03em; line-height:1.1; margin-bottom:1rem; transition:color .2s; }
.blog-card:hover .blog-title { color:var(--accent); }
.blog-excerpt { font-size:.85rem; color:var(--muted); line-height:1.65; }
.blog-date { position:absolute; bottom:2rem; right:2rem; font-family:'JetBrains Mono',monospace; font-size:.58rem; color:#2e2e2e; letter-spacing:.1em; }

/* ── CONTACT ────────────────────────────────────────────────── */
#contact {
  background:var(--surface); border-top:1px solid var(--border);
  display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:start;
}
.contact-big { font-family:'Bebas Neue',sans-serif; font-size:clamp(3.5rem,7vw,6.5rem); line-height:.93; letter-spacing:.02em; margin-bottom:2rem; }
.contact-big span { color:var(--accent); }
.contact-sub { color:var(--muted); font-size:1rem; line-height:1.75; margin-bottom:3rem; max-width:360px; }
.contact-links { display:flex; flex-direction:column; gap:.75rem; }
.contact-link {
  display:flex; align-items:center; gap:1.2rem;
  padding:1rem 1.5rem; border:1px solid var(--border);
  text-decoration:none; color:var(--text); transition:border-color .25s;
  position:relative; overflow:hidden;
}
.contact-link::before {
  content:''; position:absolute; inset:0;
  background:var(--accent); transform:translateX(-100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1); z-index:0;
}
.contact-link:hover::before { transform:translateX(0); }
.contact-link:hover { border-color:var(--accent); }
.contact-link>* { position:relative; z-index:1; }
.contact-icon { font-size:1.15rem; }
.contact-info { display:flex; flex-direction:column; }
.contact-type { font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); transition:color .25s; }
.contact-link:hover .contact-type { color:rgba(255,255,255,.65); }
.contact-val { font-size:.9rem; font-weight:400; }
.contact-form { display:flex; flex-direction:column; gap:1.1rem; margin-top:1rem; }
.form-group { display:flex; flex-direction:column; gap:.45rem; }
.form-label { font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.form-input,.form-textarea {
  background:var(--bg); border:1px solid var(--border);
  color:var(--text); padding:.9rem 1.2rem;
  font-family:'DM Sans',sans-serif; font-size:.9rem;
  outline:none; transition:border-color .2s; resize:none;
}
.form-input:focus,.form-textarea:focus { border-color:var(--accent); }
.form-textarea { min-height:110px; }
.form-submit {
  background:var(--accent); color:#fff; border:none;
  padding:1rem 2.5rem;
  font-family:'JetBrains Mono',monospace; font-size:.72rem; letter-spacing:.15em;
  text-transform:uppercase; cursor:none;
  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
  transition:background .2s,letter-spacing .2s; align-self:flex-start;
}
.form-submit:hover { background:#d93000; letter-spacing:.2em; }
.form-submit:disabled { opacity:.5; }
#form-status {
  font-family:'JetBrains Mono',monospace; font-size:.7rem;
  padding:.7rem 1rem; margin-top:.5rem; display:none;
}
#form-status.ok { border:1px solid #4caf50; color:#4caf50; background:rgba(76,175,80,.08); display:block; }
#form-status.err { border:1px solid var(--accent); color:var(--accent); background:rgba(255,60,0,.08); display:block; }

/* ── FOOTER ─────────────────────────────────────────────────── */
footer {
  border-top:1px solid var(--border); padding:2rem 4rem;
  display:flex; align-items:center; justify-content:space-between;
}
.footer-text { font-family:'JetBrains Mono',monospace; font-size:.62rem; color:var(--muted); letter-spacing:.1em; }
.footer-name { font-family:'Bebas Neue',sans-serif; font-size:1.2rem; letter-spacing:.12em; color:#222; }

/* ── FADE ANIMATION ─────────────────────────────────────────── */
.fade-up { opacity:0; transform:translateY(32px); transition:opacity .7s ease,transform .7s ease; }
.fade-up.visible { opacity:1; transform:translateY(0); }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media(max-width:900px){
  nav{padding:1.2rem 2rem}
  .nav-links{gap:1.5rem}
  section{padding:5rem 2rem}
  #hero{padding:0 2rem 5rem}
  #about{grid-template-columns:1fr;gap:3rem}
  #contact{grid-template-columns:1fr;gap:3rem}
  .work-featured{grid-template-columns:1fr}
  .work-img{min-height:200px}
  .blog-grid{grid-template-columns:1fr}
  footer{flex-direction:column;gap:1rem;text-align:center}
  .modal-facts{grid-template-columns:1fr}
}
