/*
Theme Name: Tugende Bike Café
Theme URI: https://tugende.rw/
Author: Tugende
Description: A responsive one-page WordPress theme for Tugende Bike Café in Kigali.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: tugende-bike-cafe
*/
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700;800;900&family=Krona+One&display=swap');
:root{--font-display:"Krona One",Arial,sans-serif;--font-body:"DM Sans",Arial,sans-serif;--font-script:cursive}
:root{--ink:#17231b;--lime:#d8ff43;--orange:#ff6634;--cream:#f2eedf;--paper:#fffdf5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body),sans-serif}a{color:inherit;text-decoration:none}.nav-wrap{height:92px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:10;width:100%;border-bottom:1px solid #17231b44}.brand{display:flex;flex-direction:column;line-height:.82;transform:rotate(-2deg)}.brand span{font:25px var(--font-display);letter-spacing:-1px}.brand small{font-size:9px;letter-spacing:4px;margin-top:6px;font-weight:800}.nav-links{display:flex;align-items:center;gap:32px;font-weight:700;font-size:14px}.nav-cta{padding:13px 19px;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:var(--lime)}.menu-toggle{display:none;background:none;border:0;font:700 14px var(--font-body)}
.hero{min-height:780px;display:grid;grid-template-columns:54% 46%;padding-top:92px;background:var(--lime);overflow:hidden;position:relative}.hero-copy{padding:110px 5vw 80px;position:relative;z-index:2}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:2.6px;font-weight:800;margin:0 0 25px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:var(--font-display);text-transform:uppercase;letter-spacing:-.05em;line-height:.93}h1{font-size:clamp(60px,7.1vw,114px);margin:0 0 30px}h1 em{font-style:normal;color:var(--orange);text-shadow:3px 3px 0 var(--ink);-webkit-text-stroke:2px var(--ink)}.intro{max-width:610px;font-size:19px;line-height:1.55;font-weight:500}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:42px}.btn{display:inline-flex;align-items:center;gap:35px;padding:18px 22px;font-weight:800;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);transition:.2s}.btn:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}.btn.dark{background:var(--ink);color:#fff;box-shadow:5px 5px 0 var(--orange)}.btn.lime{background:var(--lime);color:var(--ink)}.text-link{font-weight:800;border-bottom:2px solid;padding-bottom:4px}.hero-visual{position:relative;background:var(--orange);overflow:hidden;border-left:2px solid var(--ink)}.hero-grid{position:absolute;inset:0;opacity:.1;background-image:linear-gradient(var(--ink) 1px,transparent 1px),linear-gradient(90deg,var(--ink) 1px,transparent 1px);background-size:42px 42px}.sun{width:320px;height:320px;border-radius:50%;background:var(--lime);position:absolute;top:80px;right:-40px;border:3px solid var(--ink)}.wheel{position:absolute;border:13px solid var(--ink);border-radius:50%;width:230px;height:230px;bottom:105px}.wheel:after{content:"";position:absolute;left:50%;top:-11px;width:3px;height:228px;background:var(--ink);transform:rotate(45deg)}.wheel-one{left:8%}.wheel-two{right:-3%}.bike-line{position:absolute;top:255px;left:10%;font:70px var(--font-display);transform:rotate(-9deg);-webkit-text-stroke:2px var(--ink);color:var(--cream);text-shadow:4px 4px 0 var(--ink)}.visual-note{position:absolute;right:30px;bottom:27px;font-weight:800;letter-spacing:2px;text-transform:uppercase}.ticker{background:var(--ink);color:var(--lime);padding:15px 0;overflow:hidden;white-space:nowrap;font:18px var(--font-display);letter-spacing:2px}.ticker div{animation:move 20s linear infinite;width:max-content}@keyframes move{to{transform:translateX(-50%)}}
.section{padding:120px 5vw}.cafe{display:grid;grid-template-columns:1.2fr .8fr;column-gap:10vw}.section-heading h2,.rides h2,.workshop h2,.visit h2{font-size:clamp(46px,5.8vw,85px);margin:0}.section-lead{max-width:480px;font-size:19px;line-height:1.7;align-self:end}.cards{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:75px}.card{min-height:350px;padding:28px;border:2px solid var(--ink);position:relative;box-shadow:7px 7px 0 var(--ink)}.card-1{background:var(--cream);transform:rotate(-1deg)}.card-2{background:var(--orange);transform:translateY(20px)}.card-3{background:var(--lime);transform:rotate(1deg)}.card-number{font-weight:900}.card-icon{display:block;font-size:54px;margin:60px 0 28px;filter:grayscale(1)}.card h3{font:28px var(--font-display);text-transform:uppercase}.card p{line-height:1.6;max-width:320px}
.rides{background:var(--ink);color:#fff;padding:120px 5vw;display:grid;grid-template-columns:.8fr 1.2fr;gap:10vw}.eyebrow.light{color:var(--lime)}.rides-copy>p:not(.eyebrow){font-size:18px;line-height:1.7;max-width:520px;margin:30px 0 40px;color:#d1d7d2}.ride-list{display:flex;flex-direction:column;gap:13px;justify-content:center}.ride-row{color:var(--ink);padding:24px;display:grid;grid-template-columns:80px 1fr 30px;align-items:center;border:2px solid #fff;transition:.2s}.ride-row:hover{transform:translateX(-8px)}.ride-row.lime{background:var(--lime)}.ride-row.orange{background:var(--orange)}.ride-row.cream{background:var(--cream)}.ride-row strong{font:20px var(--font-display)}.ride-row h3{font:24px var(--font-display);text-transform:uppercase;margin:0 0 6px}.ride-row p{margin:0}.ride-row>span{font-size:24px}
.workshop{display:grid;grid-template-columns:1fr 1fr;min-height:700px}.workshop-art{background:var(--cream);min-height:650px;position:relative;overflow:hidden;display:grid;place-items:center;border-right:2px solid var(--ink)}.workshop-art>span{position:absolute;font-size:70px;top:40px;left:50px}.workshop-art>p{position:absolute;bottom:40px;font:30px var(--font-display)}.big-wheel{width:380px;height:380px;border:20px solid var(--orange);border-radius:50%;box-shadow:0 0 0 3px var(--ink),inset 0 0 0 3px var(--ink)}.workshop-copy{padding:100px 8vw;background:var(--lime)}.workshop-copy>p:not(.eyebrow){font-size:18px;line-height:1.7;margin:30px 0}.workshop-copy ul{padding:0;list-style:none;margin:0 0 40px}.workshop-copy li{border-top:1px solid;padding:15px 0;font-weight:700}.workshop-copy li:last-child{border-bottom:1px solid}.quote{padding:100px 8vw;text-align:center;background:var(--orange);border-block:2px solid}.quote p{font:clamp(34px,5vw,74px)/1.05 var(--font-display);text-transform:uppercase;max-width:1100px;margin:0 auto 20px}.quote span{font-weight:800;text-transform:uppercase;letter-spacing:2px}.visit{padding:120px 5vw 100px;display:grid;grid-template-columns:1fr 1fr;gap:8vw}.visit-details{display:grid;grid-template-columns:1fr 1fr;gap:50px 30px}.visit-details div:last-child{grid-column:1/-1}.visit-details h3{font:20px var(--font-display);text-transform:uppercase;border-bottom:2px solid;padding-bottom:10px}.visit-details p{line-height:1.7}.visit-details a{font-weight:800;color:#d74721;border-bottom:1px solid}footer{background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:48px 5vw}.footer-brand{color:var(--lime)}footer p{margin:0;font-size:13px}
@media(max-width:800px){.nav-wrap{height:74px}.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:74px;left:0;right:0;background:var(--paper);padding:28px 5vw;flex-direction:column;align-items:flex-start;border-bottom:2px solid}.nav-links.open{display:flex}.hero{grid-template-columns:1fr;padding-top:74px}.hero-copy{padding-top:80px}.hero-visual{height:420px;border-left:0;border-top:2px solid}.sun{width:220px;height:220px}.wheel{width:165px;height:165px}.wheel:after{height:163px}.bike-line{font-size:48px;top:135px}.cafe,.rides,.visit{grid-template-columns:1fr}.section-lead{margin-top:30px}.cards{grid-template-columns:1fr}.card{min-height:300px}.card-2{transform:none}.rides{gap:65px}.workshop{grid-template-columns:1fr}.workshop-art{min-height:480px;border-right:0;border-bottom:2px solid}.big-wheel{width:280px;height:280px}.visit-details{margin-top:30px}footer{flex-direction:column;gap:26px;text-align:center}.section,.rides,.visit{padding-block:85px}.hero-actions{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){.hero-copy,.section,.rides,.visit,.workshop-copy,.nav-wrap{padding-inline:20px}.ride-row{grid-template-columns:58px 1fr 20px;padding:17px}.ride-row h3{font-size:18px}.visit-details{grid-template-columns:1fr}.visit-details div:last-child{grid-column:auto}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker div{animation:none}}
