:root{--ink:#151820;--muted:#68707f;--paper:#f7f8fa;--white:#fff;--orange:#ff7426;--orange2:#ff9a54;--line:#e4e7ec;--dark:#11141a;--radius:18px;--shadow:0 24px 70px rgba(20,24,32,.12)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Manrope,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.skip-link{position:absolute;left:-999px;top:10px;background:#fff;padding:10px;z-index:999}
.skip-link:focus{left:10px}
.site-header{height:76px;background:rgba(17,20,26,.96);color:#fff;position:absolute;top:0;left:0;right:0;z-index:20}
.nav-wrap{height:100%;display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:800;letter-spacing:.5px}
.brand>span:last-child>span{color:var(--orange);margin-left:3px}
.brand-mark{width:34px;height:34px;border:2px solid var(--orange);display:grid;place-items:center;border-radius:50%;font-size:15px;color:#fff}
.brand-mark span{font-size:9px;vertical-align:super}
.main-nav{display:flex;align-items:center;gap:28px;margin-left:auto}
.main-nav a{font-size:13px;color:#d9dde4;transition:.2s}
.main-nav a:hover{color:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:8px;padding:14px 22px;font-weight:800;font-size:13px;cursor:pointer;transition:.25s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 12px 30px rgba(255,116,38,.25)}
.btn-light{background:#fff;color:#161922}
.btn-dark{background:var(--ink);color:#fff}
.btn-ghost{border:1px solid rgba(255,255,255,.28);color:#fff}
.btn-small{padding:10px 15px}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:22px}
.hero{min-height:760px;background:radial-gradient(circle at 75% 25%,#343842 0,#1e222a 30%,#11141a 70%);color:#fff;position:relative;overflow:hidden;padding:145px 0 90px}
.hero-grid-pattern{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:40px 40px;mask-image:linear-gradient(to bottom,#000,transparent)}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:70px;align-items:center;position:relative}
.eyebrow,.section-kicker{text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:800;color:var(--orange);display:flex;align-items:center;gap:10px}
.eyebrow span{width:28px;height:2px;background:var(--orange)}
h1,h2,h3,h4,h5,p{margin-top:0}
h1{font-size:clamp(44px,5.3vw,70px);line-height:1.04;letter-spacing:-3.5px;margin:20px 0 24px;max-width:730px}
h1 em{color:var(--orange);font-style:normal}
.hero-copy>p{font-size:17px;color:#c8cdd5;max-width:610px}
.hero-actions{display:flex;gap:12px;margin:34px 0}
.hero-proof{display:flex;gap:34px;margin-top:42px;border-top:1px solid rgba(255,255,255,.12);padding-top:24px}
.hero-proof div{display:flex;flex-direction:column}
.hero-proof strong{font-size:13px}
.hero-proof span{font-size:11px;color:#9fa6b1}
.hero-visual{position:relative}
.browser-card{background:#fff;border-radius:14px;box-shadow:0 35px 90px rgba(0,0,0,.4);overflow:hidden;transform:rotate(1deg)}
.browser-top{height:35px;background:#eef0f4;display:flex;align-items:center;gap:6px;padding:0 12px}
.browser-top>span{width:7px;height:7px;border-radius:50%;background:#c8ccd3}
.browser-top div{margin-left:12px;background:#fff;border-radius:5px;color:#9aa0aa;font-size:8px;padding:4px 60px}
.mock-nav{height:50px;padding:0 25px;display:flex;align-items:center;justify-content:space-between;color:#30343d;font-size:8px}
.mock-nav b{font-size:18px;color:var(--orange)}
.mock-nav button,.mock-hero button{border:0;background:#171a20;color:#fff;border-radius:3px;padding:7px 12px;font-size:7px}
.mock-hero{height:270px;background:linear-gradient(135deg,#fff2e7,#f1f3f8);color:#171a20;padding:48px 40px;position:relative;overflow:hidden}
.mock-hero:after{content:"";position:absolute;width:230px;height:230px;background:linear-gradient(135deg,var(--orange),#ffb783);border-radius:45% 55% 65% 35%;right:-35px;top:20px;transform:rotate(15deg)}
.mock-hero small{font-size:7px;color:var(--orange);font-weight:800}
.mock-hero h2{font-size:30px;line-height:1.1;max-width:300px;margin:12px 0}
.mock-hero p{font-size:9px}
.mock-cards{display:flex;gap:12px;padding:20px 24px}
.mock-cards i{display:block;height:78px;flex:1;background:#f1f3f6;border-radius:5px}
.floating-note{position:absolute;background:#fff;color:#242833;border-radius:10px;box-shadow:var(--shadow);padding:13px 16px;display:flex;gap:12px;align-items:center}
.floating-note i{width:34px;height:34px;border-radius:8px;background:#fff1e8;color:var(--orange);display:grid;place-items:center}
.floating-note div{display:flex;flex-direction:column}
.floating-note b{font-size:11px}
.floating-note span{font-size:8px;color:#747b88}
.note-one{left:-35px;bottom:50px}
.note-two{right:-30px;top:85px}
.trust-strip{border-bottom:1px solid var(--line);padding:28px 0;background:#fff}
.trust-strip p{text-align:center;font-size:11px;text-transform:uppercase;letter-spacing:2px;color:#9298a3;margin-bottom:20px}
.industry-row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#717885}
.industry-row span{font-size:12px;font-weight:700}
.industry-row i{margin-right:7px;color:#a2a7b0}
.section{padding:110px 0}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:90px}
.align-center{align-items:center}
.section h2{font-size:clamp(34px,4vw,52px);line-height:1.12;letter-spacing:-2.3px;margin:14px 0}
.lead{font-size:17px;color:#555e6e}
.text-link,.service-card a{font-size:12px;color:var(--orange);font-weight:800;border-bottom:1px solid rgba(255,116,38,.35)}
.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:70px;
}
.service-card{
  position:relative;
  overflow:hidden;
  padding:45px;
  background:#fff;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:24px;
  cursor:pointer;
  transition:
    background-color .35s ease,
    color .35s ease,
    border-color .35s ease,
    transform .35s ease,
    box-shadow .35s ease;
}
.service-card.featured{
  background:#fff;
  color:var(--ink);
}
.service-card:hover{
  background:#181b24;
  color:#fff;
  border-color:#181b24;
  transform:translateY(-10px);
  box-shadow:0 30px 70px rgba(0,0,0,.18);
}
.service-card>i{
  margin:25px 0;
  color:var(--orange);
  font-size:34px;
  transition:transform .35s ease,color .35s ease;
}
.service-card:hover>i{
  color:var(--orange);
  transform:scale(1.08);
}
.service-number{
  position:absolute;
  top:20px;
  right:25px;
  color:#b0b5bf;
  font-size:14px;
  transition:color .35s ease;
}
.service-card:hover .service-number{
  color:rgba(255,255,255,.48);
}
.service-card h3{
  color:var(--ink);
  font-size:24px;
  transition:color .35s ease;
}
.service-card:hover h3{
  color:#fff;
}
.service-card p,
.service-card.featured p{
  color:#707886;
  font-size:16px;
  line-height:1.75;
  transition:color .35s ease;
}
.service-card:hover p,
.service-card.featured:hover p{
  color:#c5cad3;
}
.service-card a{
  color:var(--orange);
  font-size:15px;
  font-weight:800;
  border-bottom:1px solid rgba(255,116,38,.35);
  transition:color .35s ease,border-color .35s ease;
}
.service-card:hover a{
  color:#fff;
  border-color:rgba(255,255,255,.55);
}
.dark-section{background:var(--dark);color:#fff}
.split-feature{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.dashboard-window{height:430px;background:#f8f9fb;border-radius:18px;box-shadow:0 35px 80px rgba(0,0,0,.35);display:flex;overflow:hidden;transform:perspective(900px) rotateY(8deg)}
.dash-sidebar{width:76px;background:#20242b;padding:20px;display:flex;flex-direction:column;gap:20px}
.dash-sidebar b{color:var(--orange);margin-bottom:18px}
.dash-sidebar span{height:8px;background:#3c424c;border-radius:5px}
.dash-main{flex:1;padding:30px}
.dash-title{display:flex;justify-content:space-between}
.dash-title span{width:150px;height:12px;background:#dadee5}
.dash-title button{width:70px;height:24px;background:var(--orange);border:0;border-radius:4px}
.stats{display:flex;gap:12px;margin:30px 0}
.stats i{height:70px;flex:1;background:#fff;border:1px solid #e4e7ec;border-radius:8px}
.chart{height:170px;background:#fff;border:1px solid #e4e7ec;border-radius:8px;padding:20px}
.chart div{height:100%;background:linear-gradient(to top,rgba(255,116,38,.18),transparent);clip-path:polygon(0 85%,14% 63%,30% 73%,46% 36%,62% 55%,80% 18%,100% 28%,100% 100%,0 100%);border-bottom:2px solid var(--orange)}
.table-lines{margin-top:18px;display:grid;gap:8px}
.table-lines span{height:8px;background:#e5e8ed}
.section-kicker.light{color:#ff9b62}
.feature-copy p{color:#b7bdc7}
.check-list{display:grid;gap:24px;margin-top:34px}
.check-list>div{display:flex;gap:15px}
.check-list i{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:rgba(255,116,38,.15);color:var(--orange);flex:0 0 28px}
.check-list span{font-size:13px;color:#aeb5c0}
.check-list b{display:block;color:#fff;font-size:14px;margin-bottom:4px}
.section-heading.centered{text-align:center;max-width:720px}
.section-heading.centered .section-kicker{justify-content:center}
.section-heading p{color:var(--muted)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:55px}
.project-card{border-radius:var(--radius);overflow:hidden;background:#fff;border:1px solid var(--line)}
.project-browser{height:315px;padding:25px;background:#eceff3}
.pb-top{height:17px;background:#fff;border-radius:8px 8px 0 0}
.pb-body{height:248px;background:#fff;padding:28px;position:relative;overflow:hidden}
.project-info{padding:25px}
.project-info span{font-size:10px;text-transform:uppercase;color:var(--orange);font-weight:800;letter-spacing:1px}
.project-info h3{font-size:19px;margin:8px 0}
.project-info p{font-size:12px;color:var(--muted)}
.process-section{background:var(--paper)}
.process-intro{align-items:end}
.process-intro>p{color:var(--muted)}
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#dfe3e9;border:1px solid #dfe3e9;margin-top:60px}
.process-grid article{background:var(--paper);padding:38px;min-height:245px;position:relative}
.process-grid article>span{position:absolute;right:25px;top:20px;font-size:11px;color:#9ea4ae}
.process-grid i{font-size:26px;color:var(--orange);margin:18px 0}
.process-grid h3{font-size:18px}
.process-grid p{font-size:12px;color:var(--muted)}
.stats-section{padding:85px 0;background:#fff3eb}
.stats-layout{display:grid;grid-template-columns:1fr 1.4fr;gap:80px;align-items:center}
.number-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.number-grid div{border-left:1px solid #e4cbbd;padding-left:25px}
.number-grid strong,.number-grid b{font-size:38px;color:var(--orange);letter-spacing:-2px}
.number-grid span{display:block;font-size:11px;color:#7d6b61}
.tech-layout{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.tech-orbit{height:430px;position:relative;border-radius:50%;border:1px dashed #d6dae0}
.tech-orbit:before,.tech-orbit:after{content:"";position:absolute;border:1px dashed #e0e3e8;border-radius:50%;inset:55px}
.tech-orbit:after{inset:115px}
.orbit-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:112px;height:112px;background:var(--orange);color:#fff;border-radius:50%;display:grid;place-items:center;font-size:42px;font-weight:800;z-index:2}
.tech-bubble{position:absolute;width:96px;height:96px;border-radius:50%;background:#fff;box-shadow:0 12px 35px rgba(22,27,35,.12);display:grid;place-items:center;font-size:44px}
.b1{left:8%;top:45%}
.b2{left:24%;top:10%}
.b3{right:24%;top:8%}
.b4{right:5%;top:46%}
.b5{right:25%;bottom:8%}
.b6{left:24%;bottom:8%}
.mini-points{display:grid;gap:12px;margin-top:28px}
.mini-points span{font-size:13px}
.mini-points i{color:var(--orange);margin-right:8px}
.faq-section{background:var(--paper)}
.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:100px}
.faq-heading p{color:var(--muted);margin-bottom:25px}
.faq-item{border-bottom:1px solid #dfe3e8}
.faq-item button{width:100%;padding:22px 0;border:0;background:transparent;display:flex;justify-content:space-between;text-align:left;font-weight:800;cursor:pointer}
.faq-item button i{color:var(--orange);transition:.25s}
.faq-item.active button i{transform:rotate(45deg)}
.faq-answer{display:none;padding:0 35px 20px 0}
.faq-item.active .faq-answer{display:block}
.faq-answer p{font-size:13px;color:var(--muted)}
.contact-section{background:var(--paper);padding:0 0 110px}
.contact-card{background:var(--dark);color:#fff;border-radius:26px;padding:70px;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;position:relative;overflow:hidden}
.contact-card:after{content:"";position:absolute;width:260px;height:260px;border:70px solid rgba(255,116,38,.08);border-radius:50%;left:-130px;bottom:-160px}
.contact-copy>p{color:#bac0ca}
.contact-details{display:grid;gap:12px;margin-top:30px;font-size:13px}
.contact-details i{color:var(--orange);width:25px}
.contact-form{background:#fff;color:var(--ink);padding:32px;border-radius:16px;position:relative;z-index:2}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form label{display:grid;gap:7px;font-size:11px;font-weight:800;margin-bottom:16px}
.contact-form input,.contact-form select,.contact-form textarea{border:1px solid #dce0e6;border-radius:7px;padding:12px 13px;background:#fff;outline:none}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,116,38,.1)}
.contact-form textarea{resize:vertical}
.form-submit{width:100%}
.form-status{margin:12px 0 0;font-size:12px}
.hp-field{position:absolute!important;left:-9999px!important}
.site-footer{background:#0c0f13;color:#fff;padding:70px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1.3fr;gap:60px}
.footer-about p,.footer-grid>div>p{font-size:12px;color:#9299a4;max-width:310px;margin-top:20px}
.footer-grid h5{font-size:12px;text-transform:uppercase;letter-spacing:1px}
.footer-grid>div:not(:first-child) a{display:block;font-size:12px;color:#aab0ba;margin-bottom:9px}
.footer-grid a:hover{color:#fff}
.footer-bottom{border-top:1px solid #242830;margin-top:50px;padding-top:22px;display:flex;justify-content:space-between;font-size:10px;color:#777f8c}
.footer-bottom div{display:flex;gap:20px}
.back-top{position:fixed;right:25px;bottom:25px;width:42px;height:42px;border:0;border-radius:50%;background:var(--orange);color:#fff;display:none;z-index:30;cursor:pointer}
.back-top.show{display:block}
@media(max-width:980px){.main-nav,.nav-cta{display:none}
.menu-toggle{display:block;margin-left:auto}
.main-nav.open{display:flex;position:absolute;top:76px;left:0;right:0;background:#151920;padding:22px;flex-direction:column;align-items:flex-start}
.hero-grid,.split-feature,.tech-layout,.faq-layout,.contact-card{grid-template-columns:1fr}
.hero-copy{text-align:center}
.eyebrow{justify-content:center}
.hero-copy>p{margin-left:auto;margin-right:auto}
.hero-actions,.hero-proof{justify-content:center}
.hero-visual{max-width:650px;margin:auto}
.service-grid,.portfolio-grid,.process-grid{grid-template-columns:repeat(2,1fr)}
.two-col,.stats-layout{gap:40px}
.contact-card{gap:40px}
.footer-grid{grid-template-columns:2fr 1fr 1fr}
.footer-grid>div:last-child{grid-column:1/-1}
.feature-visual{max-width:650px;margin:auto}
.faq-layout{gap:50px}}
@media(max-width:680px){.container{width:min(100% - 28px,1180px)}
.site-header{height:68px}
.main-nav.open{top:68px}
.hero{padding-top:120px;min-height:auto}
.hero-grid{gap:50px}
h1{font-size:42px;letter-spacing:-2.2px}
.hero-actions,.hero-proof{flex-direction:column}
.hero-proof{gap:18px}
.hero-visual{padding:0 8px}
.floating-note{display:none}
.browser-top div{padding:4px 20px}
.mock-hero{height:220px;padding:35px 24px}
.mock-hero h2{font-size:24px}
.industry-row{justify-content:center}
.section{padding:75px 0}
.two-col,.service-grid,.portfolio-grid,.process-grid,.stats-layout,.tech-layout,.faq-layout,.contact-card,.footer-grid{grid-template-columns:1fr}
.two-col{gap:22px}
.service-grid{margin-top:45px}
.dashboard-window{height:330px}
.stats-layout{gap:35px}
.number-grid{grid-template-columns:1fr 1fr}
.tech-orbit{height:330px}
.contact-card{padding:35px 22px}
.form-row{grid-template-columns:1fr}
.footer-grid{gap:30px}
.footer-grid>div:last-child{grid-column:auto}
.footer-bottom{flex-direction:column;gap:12px}
.section h2{font-size:35px}
.project-browser{height:280px}
.pb-body{height:213px}}

/* Larger, more readable typography */
body{font-size:18px}
.brand{font-size:17px}
.main-nav a{font-size:16px}
.btn{font-size:16px;padding:15px 24px}
.btn-small{font-size:15px;padding:11px 17px}
.eyebrow,.section-kicker{font-size:13px}
.hero-copy>p{font-size:20px;line-height:1.75}
.hero-proof strong{font-size:16px}
.hero-proof span{font-size:14px}
.trust-strip p{font-size:13px}
.industry-row span{font-size:15px}
.lead{font-size:20px;line-height:1.8}
.feature-copy>p,.process-intro>p,.tech-layout p,.faq-heading p,.contact-copy>p,.section-heading p{font-size:18px;line-height:1.75}
.check-list span{font-size:16px}
.check-list b{font-size:18px}
.project-info span{font-size:13px}
.project-info h3{font-size:26px}
.project-info p{font-size:16px;line-height:1.7}
.process-grid h3{font-size:23px}
.process-grid p{font-size:16px;line-height:1.7}
.number-grid span{font-size:14px}
.mini-points span{font-size:16px}
.faq-item button{font-size:18px}
.faq-answer p{font-size:16px;line-height:1.75}
.contact-details{font-size:16px}
.contact-form label{font-size:14px}
.contact-form input,.contact-form select,.contact-form textarea{font-size:16px}
.form-status{font-size:14px}
.footer-about p,.footer-grid>div>p{font-size:15px}
.footer-grid h5{font-size:15px}
.footer-grid>div:not(:first-child) a{font-size:15px}
.footer-bottom{font-size:13px}

/* Genuine two-project portfolio */
.portfolio-grid-two{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:1100px;
}
.project-link{
  display:block;
  height:100%;
  color:inherit;
}
.project-card{
  overflow:hidden;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;
}
.project-card:hover{
  border-color:transparent;
  transform:translateY(-8px);
  box-shadow:var(--shadow);
}
.project-browser.real-project-preview{
  position:relative;
  overflow:hidden;
  height:430px;
  padding:0;
  background:#11141a;
}
.project-browser.real-project-preview .pb-top{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:6px;
  height:32px;
  padding:0 12px;
  background:#eef0f4;
  border-radius:0;
}
.pb-top>span{
  width:7px;
  height:7px;
  background:#c7ccd4;
  border-radius:50%;
}
.pb-top small{
  margin-left:8px;
  color:#8e95a0;
  font-size:10px;
}
.project-screenshot{
  display:block;
  width:100%;
  height:398px;
  object-fit:cover;
  object-position:top center;
  transition:transform .65s ease;
}
.project-card:hover .project-screenshot{
  transform:scale(1.025);
}
.project-info{
  padding:30px;
}
.project-info>span{
  display:inline-block;
  margin-bottom:10px;
  color:var(--orange);
  font-size:13px;
  font-weight:800;
  letter-spacing:1px;
  text-transform:uppercase;
}
.project-info h3{
  margin:8px 0 12px;
  font-size:26px;
}
.project-info p{
  color:var(--muted);
  font-size:16px;
  line-height:1.7;
}
.project-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:20px 0 22px;
}
.project-tags span{
  padding:8px 12px;
  background:#f8fafc;
  color:#344054;
  border:1px solid var(--line);
  border-radius:999px;
  font-size:13px;
  font-weight:700;
}
.project-cta{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:5px;
  color:var(--orange);
  font-size:15px;
}
.project-cta i{
  transition:transform .25s ease;
}
.project-card:hover .project-cta i{
  transform:translate(3px,-3px);
}
@media(max-width:980px){.portfolio-grid-two{grid-template-columns:1fr;max-width:720px}
.project-browser{height:380px}}
@media(max-width:680px){body{font-size:17px}
.main-nav a{font-size:16px}
.hero-copy>p{font-size:18px}
.lead{font-size:18px}
.service-card h3{font-size:22px}
.service-card p,.process-grid p,.project-info p,.faq-answer p{font-size:16px}
.project-browser{height:320px;padding:18px}
.pb-body{height:266px;padding:25px}
.project-info{padding:24px}}
.faq-section{
    padding:80px 0;
}

.faq-layout{
    gap:40px;
}

.accordion{
    padding:20px;
}


.dashboard-window{
    width:100%;
    max-width:720px;
    margin:0 auto;
    overflow:hidden;
    background:transparent;
    border-radius:22px;
    box-shadow:0 30px 80px rgba(0,0,0,.25);
}

.dashboard-image{
    display:block;
    width:100%;
    height:auto;
    border-radius:22px;
    transition:transform .4s ease;
}

.dashboard-window:hover .dashboard-image{
    transform:scale(1.02);
}

/* ===========================
   Services Dropdown
=========================== */

.main-nav{
    display:flex;
    align-items:center;
    gap:30px;
}

.nav-dropdown{
    position:relative;
}

.nav-dropdown>a{
    display:flex;
    align-items:center;
    gap:8px;
}

.nav-dropdown>a i{
    font-size:12px;
    transition:.3s;
}

.dropdown-menu{
    position:absolute;
    top:100%;
    left:0;
    min-width:300px;
    background:#ffffff;
    border-radius:14px;
    box-shadow:0 15px 40px rgba(0,0,0,.12);
    padding:12px 0;
    opacity:0;
    visibility:hidden;
    transform:translateY(12px);
    transition:.3s ease;
    z-index:999;
}

.nav-dropdown:hover .dropdown-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.nav-dropdown:hover>a i{
    transform:rotate(180deg);
}

.dropdown-menu a{
    display:block;
    padding:14px 22px;
    color:#111827;
    text-decoration:none;
    font-size:16px;
    font-weight:600;
    transition:.25s;
}

.dropdown-menu a:hover{
    background:#ff6b22;
    color:#fff;
}

@media(max-width:991px){

    .dropdown-menu{
        position:static;
        opacity:1;
        visibility:visible;
        transform:none;
        box-shadow:none;
        background:transparent;
        padding:0;
        min-width:100%;
    }

    .dropdown-menu a{
        padding:10px 0 10px 20px;
    }

}

.portfolio-grid-two .project-three {
    grid-column: 1 / -1;
}

.portfolio-grid-two .project-three .project-link {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    align-items: stretch;
}

.hwy99-real-preview {
    min-height: 520px;
}

.hwy99-real-preview .project-screenshot {
    width: 100%;
    height: 100%;
    min-height: 480px;
    object-fit: cover;
    object-position: center top;
}

.project-three .project-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 900px) {
    .portfolio-grid-two .project-three .project-link {
        grid-template-columns: 1fr;
    }

    .hwy99-real-preview {
        min-height: 380px;
    }

    .hwy99-real-preview .project-screenshot {
        min-height: 340px;
    }
}

@media (max-width: 600px) {
    .portfolio-grid-two .project-three {
        grid-column: auto;
    }

    .hwy99-real-preview {
        min-height: 300px;
    }

    .hwy99-real-preview .project-screenshot {
        min-height: 260px;
    }
}