*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{line-height:1.5;-webkit-text-size-adjust:100%}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}:root{--color-bg: #000;--color-text: #fff;--color-primary: #e55b01;--color-beard: #393939;--color-border: #fff;--font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 20px;--spacing-lg: 30px;--spacing-xl: 100px;--radius-sm: 4px;--radius-md: 10px;--radius-full: 50%;--transition: all ease-in-out .2s;--icon-size: 35px;--icon-font-size: 22px}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-family);min-height:100vh;display:flex;align-items:center;justify-content:center}a{color:inherit;text-decoration:none}.container{max-width:450px;padding:var(--spacing-xl) var(--spacing-md);margin:0 auto;width:100%}.logo{margin-bottom:var(--spacing-lg)}.logo svg{width:100%;height:auto}#barong,#family{fill:var(--color-text)}.beard{fill:var(--color-beard)}path,circle{transition:var(--transition)}path:hover,circle:hover{fill:var(--color-primary)}.social-media{margin-bottom:var(--spacing-md)}.social-media ul{list-style:none;display:flex;justify-content:center;align-items:center;gap:var(--spacing-sm);flex-wrap:wrap}.social-media li{display:inline-block}.social-media a{display:flex;align-items:center;justify-content:center;width:var(--icon-size);height:var(--icon-size);font-size:var(--icon-font-size);border:2px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text);transition:var(--transition);position:relative}.social-media a:hover,.social-media a:focus{background:var(--color-primary);border-color:var(--color-primary);transform:scale(1.1);outline:none}.social-media a:focus-visible{outline:2px solid var(--color-primary);outline-offset:4px}.social-media a:before{content:attr(title);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%) scale(0);background:var(--color-text);color:var(--color-bg);padding:4px 8px;border-radius:var(--radius-sm);font-size:12px;white-space:nowrap;pointer-events:none;opacity:0;transition:var(--transition);z-index:10}.social-media a:after{content:"";position:absolute;bottom:calc(100% + 2px);left:50%;transform:translate(-50%) scale(0);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--color-text);opacity:0;transition:var(--transition)}.social-media a:hover:before,.social-media a:focus:before{transform:translate(-50%) scale(1);opacity:1}.social-media a:hover:after,.social-media a:focus:after{transform:translate(-50%) scale(1);opacity:1}.email{padding:var(--spacing-lg);border:2px solid var(--color-border);border-radius:var(--radius-md);max-width:250px;margin:0 auto;font-size:13px;text-align:center}.email a{color:var(--color-primary);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;transition:var(--transition)}.email a:hover,.email a:focus{color:var(--color-text);text-decoration-thickness:2px}@media(max-width:500px){:root{--spacing-xl: 30px}.container{padding:var(--spacing-xl) var(--spacing-md)}.email{max-width:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media print{body{background:#fff;color:#000}.social-media a:before,.social-media a:after{display:none}}