{"id":119,"date":"2026-03-24T09:41:16","date_gmt":"2026-03-24T09:41:16","guid":{"rendered":"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/index.php\/webindex-speakers\/"},"modified":"2026-03-24T11:37:28","modified_gmt":"2026-03-24T11:37:28","slug":"webindex-speakers","status":"publish","type":"page","link":"https:\/\/dostepinn.com\/index.php\/webindex-speakers\/","title":{"rendered":"Our Rooms"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"119\" class=\"elementor elementor-119\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-b9a26d8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"b9a26d8\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-a87731c\" data-id=\"a87731c\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-ca36e17 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"ca36e17\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-4da0386\" data-id=\"4da0386\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c0dce16 eael-dual-header-content-align-left elementor-widget elementor-widget-eael-dual-color-header\" data-id=\"c0dce16\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"eael-dual-color-header.default\">\n\t\t\t\t\t\t\t\t<div class=\"eael-dual-header\">\n\t\t\t\t<h2 class=\"title eael-dch-title\"><span style=\"background: linear-gradient(#FFFFFF, #FFFFFF80)\" class=\"eael-dch-title-text eael-dch-title-lead lead gradient-color\">our rooms<\/span> <span class=\"eael-dch-title-text\"><\/span><\/h2>\t\t\t<\/div>\n\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<div class=\"elementor-element elementor-element-c77e931 elementor-widget elementor-widget-html\" data-id=\"c77e931\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<ibe-up ibe-key=\"35b41b51-d117-4319-8ccd-11eafa2a07bc\" language=\"en\"><\/ibe-up>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7613965 elementor-widget elementor-widget-html\" data-id=\"7613965\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n  <meta charset=\"UTF-8\" \/>\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n  <title>Do Step Inn \u2013 Room Categories<\/title>\r\n  <style>\r\n    :root {\r\n      --bg: #050505;\r\n      --panel: rgba(255, 255, 255, 0.06);\r\n      --panel-strong: rgba(255, 255, 255, 0.1);\r\n      --border: rgba(255, 255, 255, 0.12);\r\n      --text: #f5f5f2;\r\n      --muted: rgba(245, 245, 242, 0.7);\r\n      --gold: #c8a96b;\r\n      --shadow: 0 20px 60px rgba(0, 0, 0, 0.45);\r\n      --radius: 26px;\r\n      --transition: 320ms cubic-bezier(.2,.8,.2,1);\r\n    }\r\n\r\n    * { box-sizing: border-box; }\r\n\r\n    html { scroll-behavior: smooth; }\r\n\r\n    body {\r\n      margin: 0;\r\n      font-family: Inter, Arial, Helvetica, sans-serif;\r\n      background:\r\n        radial-gradient(circle at top left, rgba(200, 169, 107, 0.1), transparent 30%),\r\n        radial-gradient(circle at 80% 10%, rgba(255, 255, 255, 0.05), transparent 25%),\r\n        linear-gradient(180deg, #090909 0%, #040404 100%);\r\n      color: var(--text);\r\n      overflow-x: hidden;\r\n    }\r\n\r\n    .intro-overlay {\r\n      position: fixed;\r\n      inset: 0;\r\n      z-index: 999;\r\n      background: linear-gradient(180deg, #000 0%, #090909 100%);\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      animation: fadeOut 1.1s ease 2.3s forwards;\r\n    }\r\n\r\n    .intro-mark {\r\n      text-align: center;\r\n      letter-spacing: 0.18em;\r\n      text-transform: uppercase;\r\n      animation: introRise 1.3s ease forwards;\r\n    }\r\n\r\n    .intro-mark span {\r\n      display: block;\r\n      color: var(--gold);\r\n      font-size: 0.78rem;\r\n      margin-bottom: 1rem;\r\n    }\r\n\r\n    .intro-mark h1 {\r\n      margin: 0;\r\n      font-size: clamp(2rem, 7vw, 5.2rem);\r\n      font-weight: 600;\r\n    }\r\n\r\n    @keyframes introRise {\r\n      from { opacity: 0; transform: translateY(24px) scale(0.98); }\r\n      to { opacity: 1; transform: translateY(0) scale(1); }\r\n    }\r\n\r\n    @keyframes fadeOut {\r\n      to { opacity: 0; visibility: hidden; pointer-events: none; }\r\n    }\r\n\r\n    .grain::before {\r\n      content: \"\";\r\n      position: fixed;\r\n      inset: 0;\r\n      background-image: radial-gradient(rgba(255,255,255,0.05) 0.6px, transparent 0.6px);\r\n      background-size: 4px 4px;\r\n      opacity: 0.05;\r\n      pointer-events: none;\r\n      z-index: 1;\r\n    }\r\n\r\n    .page {\r\n      position: relative;\r\n      z-index: 2;\r\n      width: min(1240px, calc(100% - 32px));\r\n      margin: 0 auto;\r\n      padding: 40px 0 80px;\r\n    }\r\n\r\n    .hero {\r\n      min-height: 92vh;\r\n      display: grid;\r\n      align-items: center;\r\n      padding: 80px 0 24px;\r\n    }\r\n\r\n    .hero-inner {\r\n      display: grid;\r\n      gap: 28px;\r\n      grid-template-columns: 1.2fr 0.8fr;\r\n      align-items: end;\r\n    }\r\n\r\n    .eyebrow {\r\n      color: var(--gold);\r\n      text-transform: uppercase;\r\n      letter-spacing: 0.24em;\r\n      font-size: 0.78rem;\r\n      margin-bottom: 1rem;\r\n    }\r\n\r\n    .hero h2 {\r\n      margin: 0;\r\n      font-size: clamp(2.8rem, 7vw, 6.2rem);\r\n      line-height: 0.96;\r\n      font-weight: 600;\r\n      letter-spacing: -0.04em;\r\n      max-width: 8ch;\r\n    }\r\n\r\n    .hero p {\r\n      margin: 0;\r\n      color: var(--muted);\r\n      font-size: 1.05rem;\r\n      max-width: 34rem;\r\n      line-height: 1.7;\r\n    }\r\n\r\n    .hero-box {\r\n      background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03));\r\n      border: 1px solid var(--border);\r\n      border-radius: var(--radius);\r\n      padding: 26px;\r\n      box-shadow: var(--shadow);\r\n      backdrop-filter: blur(14px);\r\n      transform: translateY(30px);\r\n      opacity: 0;\r\n      animation: revealUp 0.9s ease 1.2s forwards;\r\n    }\r\n\r\n    .hero-stats {\r\n      display: grid;\r\n      grid-template-columns: repeat(2, 1fr);\r\n      gap: 14px;\r\n      margin-top: 18px;\r\n    }\r\n\r\n    .stat {\r\n      border: 1px solid rgba(255,255,255,0.08);\r\n      border-radius: 20px;\r\n      padding: 16px;\r\n      background: rgba(255,255,255,0.03);\r\n    }\r\n\r\n    .stat strong {\r\n      display: block;\r\n      font-size: 1.4rem;\r\n      margin-bottom: 6px;\r\n    }\r\n\r\n    .section-head {\r\n      display: flex;\r\n      align-items: end;\r\n      justify-content: space-between;\r\n      gap: 24px;\r\n      margin: 40px 0 28px;\r\n    }\r\n\r\n    .section-head h3 {\r\n      margin: 0;\r\n      font-size: clamp(1.8rem, 4vw, 3rem);\r\n      letter-spacing: -0.03em;\r\n      font-weight: 600;\r\n    }\r\n\r\n    .section-head p {\r\n      margin: 0;\r\n      color: var(--muted);\r\n      max-width: 34rem;\r\n      line-height: 1.7;\r\n    }\r\n\r\n    .filters {\r\n      display: flex;\r\n      flex-wrap: wrap;\r\n      gap: 10px;\r\n      margin-bottom: 26px;\r\n    }\r\n\r\n    .filter-btn {\r\n      border: 1px solid var(--border);\r\n      background: rgba(255,255,255,0.04);\r\n      color: var(--text);\r\n      padding: 12px 18px;\r\n      border-radius: 999px;\r\n      cursor: pointer;\r\n      transition: var(--transition);\r\n      font-size: 0.95rem;\r\n    }\r\n\r\n    .filter-btn:hover,\r\n    .filter-btn.active {\r\n      background: linear-gradient(180deg, rgba(200,169,107,0.22), rgba(200,169,107,0.08));\r\n      border-color: rgba(200,169,107,0.4);\r\n      transform: translateY(-2px);\r\n    }\r\n\r\n    .rooms-grid {\r\n      display: grid;\r\n      grid-template-columns: repeat(12, 1fr);\r\n      gap: 18px;\r\n    }\r\n\r\n    .room-card {\r\n      grid-column: span 6;\r\n      position: relative;\r\n      overflow: hidden;\r\n      min-height: 470px;\r\n      border-radius: 28px;\r\n      border: 1px solid var(--border);\r\n      background: #0d0d0d;\r\n      box-shadow: var(--shadow);\r\n      isolation: isolate;\r\n      opacity: 0;\r\n      transform: translateY(38px);\r\n      transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition), opacity var(--transition);\r\n    }\r\n\r\n    .room-card.visible {\r\n      opacity: 1;\r\n      transform: translateY(0);\r\n    }\r\n\r\n    .room-card:hover {\r\n      transform: translateY(-8px);\r\n      border-color: rgba(200,169,107,0.4);\r\n      box-shadow: 0 24px 70px rgba(0,0,0,0.55);\r\n    }\r\n\r\n    .room-card::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      inset: 0;\r\n      background: linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.2) 36%, rgba(0,0,0,0.88) 100%);\r\n      z-index: 1;\r\n    }\r\n\r\n    .room-card img {\r\n      position: absolute;\r\n      inset: 0;\r\n      width: 100%;\r\n      height: 100%;\r\n      object-fit: cover;\r\n      transform: scale(1.04);\r\n      transition: transform 0.8s ease;\r\n    }\r\n\r\n    .room-card:hover img { transform: scale(1.1); }\r\n\r\n    .room-content {\r\n      position: absolute;\r\n      inset: auto 0 0 0;\r\n      z-index: 2;\r\n      padding: 28px;\r\n    }\r\n\r\n    .room-topline {\r\n      display: flex;\r\n      gap: 10px;\r\n      flex-wrap: wrap;\r\n      margin-bottom: 14px;\r\n    }\r\n\r\n    .chip {\r\n      border: 1px solid rgba(255,255,255,0.14);\r\n      background: rgba(255,255,255,0.08);\r\n      color: var(--text);\r\n      border-radius: 999px;\r\n      padding: 7px 12px;\r\n      font-size: 0.78rem;\r\n      letter-spacing: 0.04em;\r\n      backdrop-filter: blur(10px);\r\n    }\r\n\r\n    .room-content h4 {\r\n      margin: 0 0 10px;\r\n      font-size: clamp(1.35rem, 2vw, 2rem);\r\n      font-weight: 600;\r\n      letter-spacing: -0.03em;\r\n    }\r\n\r\n    .room-content p {\r\n      margin: 0;\r\n      color: rgba(245,245,242,0.8);\r\n      line-height: 1.7;\r\n      max-width: 40ch;\r\n    }\r\n\r\n    .room-hover {\r\n      max-height: 0;\r\n      overflow: hidden;\r\n      transition: max-height 0.45s ease, margin-top 0.45s ease;\r\n    }\r\n\r\n    .room-card:hover .room-hover {\r\n      max-height: 100px;\r\n      margin-top: 16px;\r\n    }\r\n\r\n    .room-hover a {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 10px;\r\n      text-decoration: none;\r\n      color: var(--gold);\r\n      font-weight: 500;\r\n    }\r\n\r\n    .cta {\r\n      margin-top: 60px;\r\n      padding: 34px;\r\n      border-radius: 30px;\r\n      border: 1px solid var(--border);\r\n      background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(200,169,107,0.06));\r\n      display: flex;\r\n      justify-content: space-between;\r\n      gap: 20px;\r\n      align-items: center;\r\n      box-shadow: var(--shadow);\r\n    }\r\n\r\n    .cta h4 {\r\n      margin: 0 0 8px;\r\n      font-size: clamp(1.5rem, 3vw, 2.4rem);\r\n      font-weight: 600;\r\n      letter-spacing: -0.03em;\r\n    }\r\n\r\n    .cta p {\r\n      margin: 0;\r\n      color: var(--muted);\r\n      line-height: 1.7;\r\n    }\r\n\r\n    .cta a {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      min-width: 180px;\r\n      padding: 16px 24px;\r\n      border-radius: 999px;\r\n      background: linear-gradient(180deg, rgba(200,169,107,0.95), rgba(180,145,77,0.92));\r\n      color: #0b0b0b;\r\n      text-decoration: none;\r\n      font-weight: 700;\r\n      transition: var(--transition);\r\n    }\r\n\r\n    .cta a:hover { transform: translateY(-3px); }\r\n\r\n    @keyframes revealUp {\r\n      from { opacity: 0; transform: translateY(30px); }\r\n      to { opacity: 1; transform: translateY(0); }\r\n    }\r\n\r\n    .reveal {\r\n      opacity: 0;\r\n      transform: translateY(28px);\r\n      transition: 0.8s ease;\r\n    }\r\n\r\n    .reveal.visible {\r\n      opacity: 1;\r\n      transform: translateY(0);\r\n    }\r\n\r\n    @media (max-width: 980px) {\r\n      .hero-inner,\r\n      .section-head,\r\n      .cta {\r\n        grid-template-columns: 1fr;\r\n        display: grid;\r\n      }\r\n\r\n      .room-card { grid-column: span 12; }\r\n    }\r\n\r\n    @media (max-width: 640px) {\r\n      .page { width: min(100% - 20px, 1240px); }\r\n      .hero { min-height: auto; padding-top: 120px; }\r\n      .hero-box,\r\n      .cta,\r\n      .room-content { padding: 20px; }\r\n      .room-card { min-height: 410px; }\r\n      .hero-stats { grid-template-columns: 1fr; }\r\n    }\r\n  <\/style>\r\n<\/head>\r\n<body class=\"grain\">\r\n  <div class=\"intro-overlay\">\r\n    <div class=\"intro-mark\">\r\n      <span>Do Step Inn<\/span>\r\n      <h1>Room Categories<\/h1>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <main class=\"page\">\r\n    <section class=\"hero\">\r\n      <div class=\"hero-inner\">\r\n        <div class=\"reveal visible\">\r\n          <div class=\"eyebrow\">Stay in Vienna<\/div>\r\n          <h2>Spaces for every kind of stay.<\/h2>\r\n          <p>\r\n            From private comfort to social dorm living, discover room categories designed for city breaks, group stays and laid-back nights in Vienna.\r\n          <\/p>\r\n        <\/div>\r\n\r\n        <div class=\"hero-box\">\r\n          <div class=\"eyebrow\">At a glance<\/div>\r\n          <p>Elegant, modern and easy to explore \u2014 with smooth animations, rich visuals and clear room descriptions.<\/p>\r\n          <div class=\"hero-stats\">\r\n            <div class=\"stat\">\r\n              <strong>8<\/strong>\r\n              Room categories\r\n            <\/div>\r\n            <div class=\"stat\">\r\n              <strong>Private + Shared<\/strong>\r\n              For every travel style\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section>\r\n      <div class=\"section-head reveal\">\r\n        <div>\r\n          <div class=\"eyebrow\">Categories<\/div>\r\n          <h3>Choose your room<\/h3>\r\n        <\/div>\r\n        <p>Use the filters to switch between private rooms and dorm options. Replace the placeholder image links with your own room photos.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"filters reveal\">\r\n        <button class=\"filter-btn active\" data-filter=\"all\">All Rooms<\/button>\r\n        <button class=\"filter-btn\" data-filter=\"private\">Private Rooms<\/button>\r\n        <button class=\"filter-btn\" data-filter=\"dorm\">Dorms<\/button>\r\n      <\/div>\r\n\r\n      <div class=\"rooms-grid\">\r\n        <article class=\"room-card\" data-type=\"private\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/02\/Untitled-design-20.jpg\" alt=\"Single Room\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Private<\/span>\r\n              <span class=\"chip\">1 Guest<\/span>\r\n            <\/div>\r\n            <h4>Single Room<\/h4>\r\n            <p>A compact and comfortable space for solo travelers who prefer privacy, calm and a simple city stay.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this room \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"private\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/03\/Be-Free-Hostel-14.jpg\" alt=\"Double Room\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Private<\/span>\r\n              <span class=\"chip\">2 Guests<\/span>\r\n            <\/div>\r\n            <h4>Double Room<\/h4>\r\n            <p>Perfect for couples or friends looking for a stylish, practical room with a relaxed and modern feel.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this room \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"private\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/03\/Be-Free-Hostel-16.jpg\" alt=\"Triple Room with three beds\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Private<\/span>\r\n              <span class=\"chip\">3 Guests<\/span>\r\n            <\/div>\r\n            <h4>Triple Room<\/h4>\r\n            <p>Designed for small groups, with three separate beds and enough space to stay together in comfort.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this room \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"private\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/03\/Be-Free-Hostel-17.jpg\" alt=\"3 Person Room with double bed and single bed\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Private<\/span>\r\n              <span class=\"chip\">3 Guests<\/span>\r\n            <\/div>\r\n            <h4>3 Person Room<\/h4>\r\n            <p>Featuring one double bed and one single bed, this category is ideal for friends, couples with company or small families.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this room \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"private\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/03\/Be-Free-Hostel-15.jpg\" alt=\"Four Bed Room\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Private<\/span>\r\n              <span class=\"chip\">4 Guests<\/span>\r\n            <\/div>\r\n            <h4>Four Bed Room<\/h4>\r\n            <p>A smart choice for groups who want to share one room while keeping the stay easy, flexible and comfortable.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this room \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"private\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/02\/Untitled-design-26.jpg\" alt=\"Premium Double Room\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Premium<\/span>\r\n              <span class=\"chip\">2 Guests<\/span>\r\n            <\/div>\r\n            <h4>Premium Double Room<\/h4>\r\n            <p>An elevated double room experience with extra comfort, a refined atmosphere and a more polished stay.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this room \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"dorm\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/03\/Be-Free-Hostel-8.jpgy\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Dorm<\/span>\r\n              <span class=\"chip\">8 Beds<\/span>\r\n            <\/div>\r\n            <h4>Bed in 8-Bed Dorm<\/h4>\r\n            <p>Social, affordable and made for meeting fellow travelers while enjoying the energy of shared hostel living.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this bed \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <article class=\"room-card\" data-type=\"dorm\">\r\n          <img decoding=\"async\" src=\"https:\/\/quirky-ishizaka.152-53-246-62.plesk.page\/wp-content\/uploads\/2026\/02\/Untitled-design-18.jpg\" alt=\"Bed in 6 Bed Dormitory\" \/>\r\n          <div class=\"room-content\">\r\n            <div class=\"room-topline\">\r\n              <span class=\"chip\">Dorm<\/span>\r\n              <span class=\"chip\">6 Beds<\/span>\r\n            <\/div>\r\n            <h4>Bed in 6-Bed Dorm<\/h4>\r\n            <p>A balanced shared-room option with a slightly more relaxed setup while keeping the social hostel vibe alive.<\/p>\r\n            <div class=\"room-hover\"><a href=\"#\">Book this bed \u2192<\/a><\/div>\r\n          <\/div>\r\n        <\/article>\r\n      <\/div>\r\n    <\/section>\r\n  <\/main>\r\n\r\n  <script>\r\n    const filterButtons = document.querySelectorAll('.filter-btn');\r\n    const cards = document.querySelectorAll('.room-card');\r\n\r\n    filterButtons.forEach((btn) => {\r\n      btn.addEventListener('click', () => {\r\n        filterButtons.forEach((b) => b.classList.remove('active'));\r\n        btn.classList.add('active');\r\n\r\n        const filter = btn.dataset.filter;\r\n\r\n        cards.forEach((card) => {\r\n          const type = card.dataset.type;\r\n          const shouldShow = filter === 'all' || filter === type;\r\n          card.style.display = shouldShow ? 'block' : 'none';\r\n          if (shouldShow) {\r\n            requestAnimationFrame(() => card.classList.add('visible'));\r\n          }\r\n        });\r\n      });\r\n    });\r\n\r\n    const observer = new IntersectionObserver((entries) => {\r\n      entries.forEach((entry) => {\r\n        if (entry.isIntersecting) {\r\n          entry.target.classList.add('visible');\r\n        }\r\n      });\r\n    }, { threshold: 0.16 });\r\n\r\n    document.querySelectorAll('.reveal, .room-card').forEach((el, index) => {\r\n      el.style.transitionDelay = `${index * 60}ms`;\r\n      observer.observe(el);\r\n    });\r\n  <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-b746b8a elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"b746b8a\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f3a1303\" data-id=\"f3a1303\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-inner-section elementor-element elementor-element-f706ea0 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"f706ea0\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-inner-column elementor-element elementor-element-9e38101\" data-id=\"9e38101\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-9e723ae elementor-widget elementor-widget-heading\" data-id=\"9e723ae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Partners<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ec1e40c elementor-widget elementor-widget-spacer\" data-id=\"ec1e40c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>our rooms Do Step Inn \u2013 Room Categories Do Step Inn Room Categories Stay in Vienna Spaces for every kind of stay. From private comfort to social dorm living, discover room categories designed for city breaks, group stays and laid-back nights in Vienna. At a glance Elegant, modern and easy to explore \u2014 with smooth [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-119","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/pages\/119","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/comments?post=119"}],"version-history":[{"count":20,"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/pages\/119\/revisions"}],"predecessor-version":[{"id":189,"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/pages\/119\/revisions\/189"}],"wp:attachment":[{"href":"https:\/\/dostepinn.com\/index.php\/wp-json\/wp\/v2\/media?parent=119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}